-1

2 つのチェック ボックス列を持つグリッドビューがあります。1 つは選択用で、もう 1 つは「お気に入りに追加」などのプロパティを設定するためのものです。このグリッドビューはロードされたコード ビハインドであり、チェック ボックスは項目テンプレート内で定義されています。問題は、「お気に入りに追加」を選択したばかりで、選択チェックボックスも自動的にチェックする必要がある場合に、同じ行の 2 つのボックスをチェックするのはユーザーフレンドリーではないことです。これらの選択に対してポストバックを作成することは良いユーザーエクスペリエンスではないと思うので、これは jquery を使用して簡単に実行できることを理解しています。私はjqueryに非常に慣れていないので、助けていただければ幸いです。

同じ行のチェックボックスは、id に関して同じ規則に従うため、select が cbSelect_0 の場合、もう 1 つは cbfavorite_0 になります。また、すべての cbFavorite チェックボックスに同じクラス「cbMul」を与えてから、関数を作成しました

 function checkUncheck() {
 $(".cbMul").checked(function() {

if ( $(this).attr('checked')) {
    $('#myCheckbox').attr('checked', false);
} else {
    $('#myCheckbox').attr('checked', 'checked');
}

}); }

さて、チェックされたチェックボックスの属性を取得し、名前を置き換えてチェックボックスのIDを取得して選択してからチェックする方法がわかりませんか?

グリッドビューは次のとおりです。

<asp:GridView ID="gvEnvironments" EmptyDataText="--- No Data ---" runat="server" AutoGenerateColumns="false"
DataKeyNames="Id" >
<Columns>
    <asp:TemplateField HeaderText="Select">
        <ItemTemplate>
            <asp:CheckBox ID="cbSelectEnvironments" runat="server" />
        </ItemTemplate>
    </asp:TemplateField>
    <asp:BoundField DataField="Id" HeaderText="ID" InsertVisible="false" ReadOnly="true" SortExpression="Id" />
     <asp:TemplateField HeaderText="Multi">
        <ItemTemplate>
            <asp:CheckBox ID="cbFav" runat="server" Checked="false" CssClass="cbMul" />
        </ItemTemplate>
    </asp:TemplateField>
    <asp:BoundField DataField="Name" HeaderText="Name" SortExpression="Name" />
    <asp:BoundField DataField="Description" HeaderText="Description" HeaderStyle-Width="300px" SortExpression="Description" />

</Columns>

4

1 に答える 1

0

ここにフィドルがあります：http://jsfiddle.net/FyDEk/

HTML:

<table>
    <tr>
        <td>
            <input class="cb1" type="checkbox" />
        </td>
        <td>
            <div id="dd">text</div>
        </td>
        <td>
            <input class="cb2" type="checkbox" />
        </td>
    </tr>
</table>

JS:

$(function () {    
    $(".cb2").on("change", function () {
        var cb = $(this),
            cbIsChecked = cb.is(":checked"),
            cbPrev = cb.parent().parent().find(".cb1");

        if(cbIsChecked)
            cbPrev.prop("checked", true);
        else
            cbPrev.prop("checked", false);
    });    
});

CheckBoxes に適切なクラスを追加します。

于 2013-10-09T01:08:13.390 に答える