-1

私のグリッドテーブル

列ヘッダーがクリックされたときにテーブルに並べ替えオプションを追加し、そのコードを投稿します。

colNames: ['Incident key', 'Date', 'State', 'Incident no', 'FF death', 'OTH death', 'Property Loss', 'Cont Loss', 'Fire Cause'],
        colModel :[ 
        {
            name:'a.INC_KEY', 
            index:'a.INC_KEY',
            width: 220,
            hidden: true,
            editrules: {
                edithidden:true
            },
            searchoptions: {
                sopt: ['eq', 'ne','cn']
            }
        }, 

        {
            name:'a.INC_DATE', 
            index:'a.INC_DATE',
            width: 100,
            searchoptions: {
                sopt: ['eq', 'ne','cn']
            }
        }, 

        {
            name:'a.INC_NO', 
            index:'a.INC_NO',
            width: 100,
            searchoptions: {
                sopt: ['eq', 'ne','cn']
            }
        }, 

        {
            name:'a.STATE', 
            index:'a.STATE',
            width: 100,
            searchoptions: {
                sopt: ['eq', 'ne','cn']
            }
        }, 

        {
            name:'a.FF_DEATH', 
            index:'a.FF_DEATH',
            width: 80,
            searchoptions: {
                sopt: ['eq', 'ne','cn']
            }
        }, 

        {
            name:'a.OTH_DEATH', 
            index:'a.OTH_DEATH',
            width:80,
            searchoptions: {
                sopt: ['eq', 'ne','cn']
            }
        },

        {
            name:'a.PROP_LOSS', 
            index:'a.PROP_LOSS',
            width: 80,
            searchoptions: {
                sopt: ['eq', 'ne','cn']
            }
        },

        {
            name:'a.CONT_LOSS', 
            index:'a.CONT_LOSS',
            width: 80,
            searchoptions: {
                sopt: ['eq', 'ne','cn']
            }
        },

        {
            name:'a.CAUSE_CODE_DESC', 
            index:'a.CAUSE_CODE_DESC',
            width: 240,
            searchoptions: {
                sopt: ['eq', 'ne','cn']
            }
        },
        ],
        pager: '#pager',
        rowNum: 500,
        rowList:[500,100,20],
        sortname: 'INC_KEY',
        sortorder: 'desc',
        viewrecords: true,
        sortable: true,
        height: 400,
        width: 800, 
        shrinkToFit: false,
        gridview: true,
        caption: 'Reports'
    });

    jQuery("#list1").jqGrid('navGrid','#pager',{
        edit:false,
        add:false,
        del:false
    });
4

3 に答える 3

1

nameの値として、いくつかの列のプロパティからの値を使用する必要がありますsortname。現在のコードでは を使用していますが、対応する名前sortname: 'INC_KEY'の列が にありません。代わりにcolModel使用する必要があります。sortname: 'a.INC_KEY'

さらに、すべての列.の名前を名前に含めないようにすることをお勧めします。プロパティは、グリッド内のnameいくつかの値を構築するために使用され、セレクターで使用されることを理解する必要があります。特殊文字を含まない名前を使用すると、奇妙な副作用が発生するリスクが軽減され、jqGrid の一部の機能が期待どおりに動作しなくなります。リモート(または) がある場合は、プレフィックスを持つものを使用できますが、プロパティにそのようなプレフィックスを含めることはできません。iddatatype"json""xml"indexa.name

于 2012-10-18T10:57:04.390 に答える
1

これにはいくつかのプラグインが利用できます.その中にはデータテーブルがあります.

以下はリンクの例です。

http://datatables.net/release-datatables/examples/basic_init/multi_col_sort.html

于 2012-10-18T10:26:50.303 に答える
0

JQGridを使用していると思います。このコードが役立つと思います

jQuery(function() {
        $("#list1").jqGrid({
            url:'file1.php',
            datatype: 'json',
            colNames:['Member Name','Administrstor Name' ,'Time', 'Status','Mobile'],
            colModel :[ 
                {name:'memberid', index:'memberid',align:'left',width: 142,searchoptions: { sopt: ['eq', 'ne','cn']}}, 
                {name:'adminid', index:'adminid',align:'left',search: false,width: 142}, 
                {name:'sendon', index:'senton',width: 167,searchoptions: { sopt: ['eq', 'ne','cn']}}, 
                {name:'status', index:'status',width: 117,search: false},
                {name:'mobile', index:'mobile',width: 162,search: false}
            ],
            pager: '#pager',
            rowNum: 5,
            rowList:[5,10],
            sortname: 'id',
            sortorder: 'desc',
            viewrecords: true,
            height: 'auto',
            width: 790, 
            shrinkToFit: false,
            rownumbers: true,
            gridview: true,
            caption: 'Message Sent Today'
        });
        jQuery("#list1").jqGrid('navGrid','#pager',{edit:false,add:false,del:false});

    });    
于 2012-10-18T10:29:22.480 に答える