jqgrid零碎相关的东西(1)

1. 初始化的时候不加载数据设置datatype: 'local'

$("#grid").jqGrid({
url:"http://www.8qiu.cn",
datatype:"local",
//other options
});

 2. 当要加载数据的时候把datatype改成json或者XML:

$("#list").jqGrid('setGridParam',{datatype:'json'}).trigger('reloadGrid');

 3.如果不要jqgrid表头上的点击排序可以把对应的colModel中加属性sortable : false.

 

4.如果要给pager上的按钮加id(这样可以动态的hide,show此按钮)具体的方法就是

jQuery("#list").jqGrid('navButtonAdd', '#pager', 
{
caption : "导出",
title : "Excel",
position : "first",
id :'storeExp',
buttonicon :'ui-icon-calculator',

onClickButton : function ()
{

}

});

5.如果要想显示jqgrid中的caption可以在css样式中加入如下(你可以发现.ui-jqgrid .ui-jqgrid-titlebar 的div块display是none,所以没显示)

.ui-jqgrid .ui-jqgrid-titlebar
{
display:block;
}

 

6.如果要使用jqgrid中caption中文字居中显示

gridComplete: function(){
             $('#list').closest("div.ui-jqgrid-view")
                .children("div.ui-jqgrid-titlebar")
                .css("text-align", "center")
                .children("span.ui-jqgrid-title")
                .css("float", "none");
        }

7.当浏览器的大小改变时,jqgrid的宽度作为相应的改变

gridComplete: function(){
            $(window).resize(function(){ 
                var winwidth=$(window).width()*0.5; //这里的0.5可以自己定
            $("#list").setGridWidth(winwidth);
            });
            
        }

8.在jqgrid后给每一行加超链接如下图所示

代码描述如下:

jqGridAdapter("#an");
    jQuery("#an").jqGrid({
        url : '../ListServlet?className=announcement',
        datatype : "json",
        colNames : ['ID', '公告标题', '更新时间', '覆盖区域','操作'],
        colModel : [{
                    name : 'ID',
                    index : 'ID',
                    hidden : true,
                    width : '55px'
                }, {
                    name : 'ANNOUNCEMENT_TITLE',
                    index : 'ANNOUNCEMENT_TITLE',
                    width : '100px',
                    align : 'left',
                    sortable:false
                }, {
                    name : 'UPDATE_DATE',
                    index : 'UPDATE_DATE',
                    width : '100px',
                    align: 'left',
                    formatter:'date',
                    formatoptions:{srcformat:'Y-m-d H:i',newformat:'Y-m-d'},
                    sortable:false
                }, {
                    name : 'ANNOUNCEMENT_REGION',
                    index : 'ANNOUNCEMENT_REGION',
                    width : '100px',
                    align: 'center',
                    sortable:false
                }, {
                    name : 'LOOK',
                    index : 'LOOK',
                    width : '50px',
                    align: 'center',
                    sortable:false
                }
                ],
                rowNum :15,
                rowList : [15, 25, 30,50,100],
                pager : '#an_pager',
                viewrecords : true,
                sortname : 'update_date',
                autowidth:true,
                sortorder : "desc",
                caption : "ca",
                multiselect : false,
                rownumbers : true,
        jsonReader : {
            id : 'ID',
            repeatitems : false
        },
        gridComplete:function()
        {
　　　　　　　var ids=jQuery("#an").jqGrid('getDataIDs');
56            for(var i=0; i<ids.length; i++){
57                 var id=ids[i];   
58                focusNum = "<a href='#' style='color:#f60' alt='点击查看详细' onclick='showannouncement(" + id + ")'>查看</a>";
59                 jQuery("#an").jqGrid('setRowData', ids[i], { LOOK: focusNum});
61             }
62　　　　 },
        height : 'auto'
    });

9.jqgrid关于日期格式化在colModel中添加

formatter:'date',
formatoptions:{srcformat:'Y-m-d H:i',newformat:'Y-m-d'}

这里面有很多东西都是在实际问题中遇到的,并且已经解决了的,有部分是从大牛们的网站上找到的解决方法,也有是自己遇到后想办法解决的,在此贡献整理出,希望能够帮助大家.如果大家遇到这些问题有更好的解决方法,可以给我直接留言或者站内信.

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　－－IT学习更简单．