1

私は jqGrid で多くの作業を行ってきましたが、すべてが機能します (並べ替え、列の並べ替え、columnChooser での列の追加/削除、columnChooser での列の並べ替えなど)。ただし、小さなことが 1 つあります。

グリッドに渡す colModel の最初のリストには、表示される順序で列が含まれており、非表示の可能性のある列 (列など) のリストも含まれています。

Id、Name、Date(非表示)、AValue、BValue、CValue(非表示)

columnChooser を開くと、表示されている列がグリッドに表示される順序で左側に表示されます。表示されない列は、Date、CValue として右側に表示されます。グリッドからすべての列を削除すると、列選択ダイアログの右側にある選択されていない列の順序は、colModel で定義されているとおりになります: Id、Name、Date、...

選択した列を並べ替えのために画面に表示される順序で表示したいのですが、右側の選択されていない列を常にアルファベット順に表示したいのですが、それは何とか可能ですか?

4

1 に答える 1

0

これを機能させるのに苦労しましたが、最終的には、独自のイベント ハンドラーをダイアログに追加して、右側を手動で並べ替えることにしました。

//Add the button to the jqGrid toolbar
$('#MyGridId').jqGrid('navButtonAdd', '#MyGridToolbar', {
    buttonicon: 'ui-icon-transferthick-e-w',
    caption: 'Select Columns',
    title: 'Select Columns',
    onClickButton: function () {
        $(this).jqGrid('columnChooser', {
            done: function (perm) {
                if (perm) {
                    this.jqGrid('remapColumns', perm, true);
                }
            }
        });

        //Setup custom event bindings and give the right side an initial sort
        BindColPickerActions($.jgrid.jqID(this.id));
        SortColPickerAvailable($.jgrid.jqID(this.id));
    }
});

//function to add click event bindings to the dialog actions
function BindColPickerActions(gridId) {
    var colpickerId = 'colchooser_' + gridId;

    //When moving an item from selected to available (Hiding)
    $('#' + colpickerId + ' .selected a:not(.SortModifier)').bind('click', function(){
        SortColPickerAvailable(gridId);
        BindColPickerActions(gridId);
    });

    //When moving an item from available to selected (Showing)
    $('#' + colpickerId + ' .available a:not(.SortModifier)').bind('click', function(){
        BindColPickerActions(gridId);
    });

    //add a class to the actions that have been modified to keep track
    $('#colchooser_' + colpickerId + ' .available a:not(.SortModifier), #' + colpickerId + ' .available a:not(.SortModifier)').addClass('SortModifier');
}

//function to sort the available list
function SortColPickerAvailable(gridId) {
    //get the list of li items
    var colpickerId = 'colchooser_' + gridId;
    var available = $('#' + colpickerId + ' .available .connected-list');
    var li = available.children('.ui-element');

    //detatch and sort the li items
    li.detach().sort(function(a, b) {
        return $(a).attr('title').toUpperCase().localeCompare($(b).attr('title').toUpperCase());
    }); 

    //re-attach the li items           
    available.append(li);
}
于 2013-07-03T14:57:41.417 に答える