Несколько пользовательских элементов управления и клиент asp.net JS

Question

Я подписан на пост:

http://mosesofegypt.net/post/GridView-with-Select-All-CheckBox-using-JQuery.aspx

для создания столбца флажка в сетке вида asp.net с возможностью выбора / отмены выбора всех функций. В моем случае gridview и код javascript (JQuery) находятся внутри динамически загружаемого пользовательского элемента управления, и существует более одного экземпляра этого пользовательского элемента управления. Функция выбора / отмены выбора работает только в последнем пользовательском контроле, созданном на странице. Другими словами, gvProducts.ClientId в сценарии js знает только о последнем виде сетки. Любые идеи, как я могу получить ссылку на ClientIds gridview внутри другого usercontrol (то есть, кроме последнего)? Любая помощь будет наиболее ценной.

РЕДАКТИРОВАТЬ: Этот вопрос, по сути, такой же, как задан в этом посте: Несколько экземпляров пользовательского управления и ClientID в JS но нет никаких помогающих ответов на это.

Спасибо, Али

Answer 1

Вы можете добавить CssClass в GridView и использовать для этого свой селектор jQuery.

Скрипт:

<script type="text/javascript">
    $(function () {
        $(".t th input:checkbox").click(function () {
            var $checkbox = $(this).closest('table').find(':checkbox:not(:first)');
            $checkbox.attr('checked', $(this).attr('checked'));
        });
    });
</script>

2 таблицы с одинаковым именем класса:

 <table class="t">        
    <tr>
        <th align="left" scope="col">Category</th>
        <th align="left" scope="col">Product</th>
        <th align="right" scope="col">Unit Price</th>
        <th align="left" scope="col">Supplier</th>
        <th scope="col">
            <input type="checkbox" name="select-all" />
        </th>
    </tr>
    <tr>
        <td></td>
        <td></td>
        <td></td>
        <td><input type="checkbox" /></td>
    </tr>
    <tr>
        <td></td>
        <td></td>
        <td></td>
        <td><input type="checkbox" /></td>
    </tr>
    <tr>
        <td></td>
        <td></td>
        <td></td>
        <td><input type="checkbox" /></td>
    </tr>
</table>
<br /><br /><br />
<table class="t">        
    <tr>
        <th align="left" scope="col">Category</th>
        <th align="left" scope="col">Product</th>
        <th align="right" scope="col">Unit Price</th>
        <th align="left" scope="col">Supplier</th>
        <th scope="col">
            <input type="checkbox" name="select-all" />
        </th>
    </tr>
    <tr>
        <td></td>
        <td></td>
        <td></td>
        <td><input type="checkbox" /></td>
    </tr>
    <tr>
        <td></td>
        <td></td>
        <td></td>
        <td><input type="checkbox" /></td>
    </tr>
    <tr>
        <td></td>
        <td></td>
        <td></td>
        <td><input type="checkbox" /></td>
    </tr>
</table>