0

複数選択チェックボックスを備えたjqGridテーブル（テーブルをグリッドに変換する）があります。チェックボックスのスタイルをカスタマイズするために、私はprettyCheckableを使用しました。これは、ラベルとアンカー (href) およびチェックボックス入力用の div コンテナー (非表示で、ラベルと a で覆われています) を生成します。私の問題は、入力が機能することを確認する代わりに、ラベルが機能しないことを確認することです。

ラベルチェック済み

入力チェック済み 

<div class="clearfix prettycheckbox labelright  blue " id="aui_11140">
    <input role="checkbox" id="rs" class="cbx" type="checkbox" style="display: none;">
    <label for="rs" class="checked" id="aui_11139">
    </label>
</div>

入力の prettyCheckable の設定:

$("input[type=checkbox]").change(function() {
        $(this).triggerHandler("click");
    }).prettyCheckable();

そして、これは私のjqGrid設定です:

$(document).ready(function() {
     $('#searchForm').ajaxForm(function() {
        var _data = $('#searchForm').serialize();
        $('#ResultsTable').jqGrid().setGridParam({url: '${searchUrl}' + _data}).trigger("reloadGrid")
        return true;
    });
    jsonTable('ResultsTable', 'ResultsPager', '${searchUrl}', 'searchForm',
        {id: 'code'},
        ['Code', 'Description', 'CF'],
        [{name: 'code', index: 'code', width: 55},
        {name: 'description', index: 'description', width: 90},
        {name: 'CF', index: 'CF', width: 80},
        function(id) {
            var selRows = $(this).jqGrid('getGridParam', 'selarrrow');
            $('#edit').toggle(selRows.length == 1);
            $('#delete').toggle(selRows.length > 0);
            $('#editForm #code').val(selRows);
            $('#deleteForm #code').val(selRows);
        },
        function(aSel, selected) {
            $('#edit').toggle(false);
            $('#delete').toggle(selected);
            if (selected) {
                $('#editForm #code').val(selRows);
                $('#deleteForm #code').val(selRows);
            }
        },
        true
    )      
});

なぜこれが機能しないのですか？

ps。私はprettyCheckable.jsを編集して削除した<a>ため、生成されません。そして、css の名前を から.prettycheckbox a {}に変更しました.prettycheckbox label {}。

4

1 に答える 1

1

プラグインは次のprettyCheckableようなコードを使用します

input.prop('checked', true).change();

状態の変更をチェックボックスに転送します。一方、jqGrid にはclickイベント ハンドルのみが含まれます (行を参照)。

あなたができることは、clickイベントの場合のchangeイベントのトリガーです。

たとえば、 のグリッドがあるとしid="list"ます。次に、idすべての項目を選択するためのチェックボックスはcb_list("cb_" にグリッド ID が付加されます) になります。したがって、おそらく次のようなコードを使用します

$("#cb_list").prettyCheckable();

コードを次のように変更することをお勧めします

$("#cb_list").change(function() {
    $(this).triggerHandler("click");
}).prettyCheckable();

それはあなたの問題を解決するはずです。

于 2013-06-17T10:26:12.907 に答える