Получение значения флажка из вложенного вида сетки - PullRequest
Новая
       3

Получение значения флажка из вложенного вида сетки

0 голосов
/ 06 марта 2011

У меня есть вложенная сетка с 45 флажками.Я хочу, чтобы пользователь мог установить флажок и сохранить это значение в отдельном сеточном представлении, пока он не захочет воздействовать на него (аналогично корзине покупок).

Флажки вложены в сетку 2-го уровня за ретранслятором.

     <repeater>
       <gridview>
          <gridview>
              checkbox
          <gridview/>
       <girdview />
     <repeater />

У меня было чертовски много времени, когда я пытался понять значение этого флажка и хотел изучить jQuery, и подумал, что это хорошее время.

Я думал, что пользователь щелкнет по флажку, jQuery получит идентификатор элемента управления (и значение), затем я смог передать его триггеру обратной передачи ajax и заполнить сетку просмотра корзины покупок.Причина, по которой мне нужно пройти через ajax, заключается в том, что мне нужно получать больше значений из базы данных, основываясь на выбранном пользователем флажке.

Я думаю, я мог бы взять это оттуда.Моя самая большая проблема сейчас - выяснить, как получить идентификатор и значение из флажка.

Ответы [ 2 ]

1 голос
/ 06 марта 2011

Никогда не использовал Repeater, но с некоторыми простыми jQuery и html, я думаю, вы можете получить тот же эффект без раздутости элементов управления gridview:

Сохранить как HTML-файл для примера 

<html>
<head>
    <title>Test</title>
</head>
<body>
    <table id="tblItems">
        <tbody>
            <tr>
                <td>+</td><td>Category 1</td>
            </tr>
            <tr>
                <td>
                    <table>
                        <tbody>
                            <tr>
                                <td><input type="checkbox" /></td><td>Item 1</td><td>Price</td>
                            </tr>
                            <tr>
                                <td><input type="checkbox" /></td><td>Item 2</td><td>Price</td>
                            </tr>
                            <tr>
                                <td><input type="checkbox" /></td><td>Item 3</td><td>Price</td>
                            </tr>
                        </tbody>
                    </table>
                </td>
            </tr>
            <tr>
                <td>+</td><td>Category 2</td>
            </tr>
            <tr>
                <td>
                    <table>
                        <tbody>
                            <tr>
                                <td><input type="checkbox" /></td><td>Item 4</td><td>Price</td>
                            </tr>
                            <tr>
                                <td><input type="checkbox" /></td><td>Item 5</td><td>Price</td>
                            </tr>
                            <tr>
                                <td><input type="checkbox" /></td><td>Item 6</td><td>Price</td>
                            </tr>
                        </tbody>
                    </table>
                </td>
            </tr>
        </tbody>
    </table>
    <table id="tblResults">
        <thead>
            <tr style="font-weight:bold">
                <td >Item Name</td><td>Price</td>
            </tr>
        </thead>
        <tbody>

        </tbody>
    </table>
</body>
</html>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js" ></script>
<script>
    $(document).ready(function() {
        $('#tblItems > tbody > tr').each(function(i){
            $row = $(this);
            if(i % 2 == 0){//even rows are expanders
                $row.children('td:eq(0)').click(function(){
                    var $tmp = $(this);
                    var next = i + 1;
                    $row.parent().children("tr:eq(" + next + ")").toggle(); //toggle the next row
                    if($tmp.html() == '+'){ 
                        $tmp.html('-');
                    }else{ 
                        $tmp.html('+');
                    }
                });
            }else{//odd rows are collapsed by default
                $row.toggle();
            }
        });

        $('input[type="checkbox"]').change(function(){
            var $chkBox = $(this),
                data = $chkBox.data('checkboxData');

            if(!data){ //Add some data to remember to this checkbox
                $chkBox.data('checkboxData', {
                    id: Example.GetUniqueId() // create a unique ID for this checkbox
                });
                data = $chkBox.data('checkboxData');
            }
            if($chkBox.is(':checked')){ //checkbox is checked
                $("#tblResults tbody").append($chkBox.closest('tr').clone().attr('id', data.id)); //copy the checked row and add ID
                $("#tblResults input").parent().remove(); //remove the checkbox from the copied row
            }else{
                $("#" + data.id).remove(); //remove copied row when not checked 
            }
        });
    });

    Example = {};

    Example.GetUniqueId = function ()
    {
         var dateObject = new Date();
         var uniqueId =
              dateObject.getFullYear() + '' +
              dateObject.getMonth() + '' +
              dateObject.getDate() + '' +
              dateObject.getTime();

         return uniqueId;
    };
</script>
1 голос
/ 06 марта 2011

Вы должны иметь возможность получить значение (или некоторые данные) из флажка, который щелкает чем-то вроде

$ ('# gridview-wrapper checkbox'). Live ("click", function (e) { // сделать что-то со значением из клика.

});

вы можете использовать эту информацию для заполнения чего-либо в другом месте страницы или сохранить значение в массиве данных.

Массив данных - это в основном способ хранения данных пары ключ-значение в jquery, готовом к использованию, когда пользователь выполняет другое действие на странице.

подробнее здесь -> http://api.jquery.com/data/

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...