• jgGrid常用操作--持续更新


    最近有使用到jqGrid框架,有个需求是单击某个字段,比如name,然后把id带过去执行一个function,网上有说用线获取选中行,然后再得到id的方法,此方法经实验,必须要先选中才行,在用户没有进行选中,直接点击的情况下,并不能拿到id值,所以觉得可以在初始化表格的时候,就把这个属性给要点击的行附上,也就不需要先选中了:

    1.首先是初始化表格:

    $("#jqGrid").jqGrid({
        url:"<%=request.getContextPath() %>/ajax/workshop/queryPrivateResourceWorkshopList",
        mtype:"POST",
        datatype:"json",
        colModel:[
             {label:"id",index:"wsid",name:"wsid",key:true,75,hidden:true},
             {label:"店铺名称",index:"wsname",name:"wsname",100,align:'center',formatter:function(cellvalue,options,row){return "<a onclick='linkbdworkshopinfo("+row.wsid+")'>"+cellvalue+"</a>"}},
             {label:"所属区域",index:"areaname",name:"areaname",100,align:'center'},
             {label:"店铺地址",index:"wsaddress",name:"wsaddress",100,align:'center'},
             {label:"认领人",index:"realname",name:"realname",100,align:'center'},
                  ],
        viewrecords:true,
        1080,
        height:400,
        rowNum:20,
        pager:"#jqGridPager",
        toolbar:[true,"top"],

    加粗部分就是设置的方法,采用formatter,设置了点击事件,以及将id作为参数带到点击事件中,可成功达到效果

    附加按钮方法:

    如果需要对每一行添加按钮,比如查看,编辑或者删除等,可参考下面:

    gridComplete:function(){
                        var ids=jQuery("#jqGrid").jqGrid('getDataIDs');
                        for(var i=0; i<ids.length; i++){
                            var id=ids[i];
                            var rowdata=jQuery("#jqGrid").jqGrid('getRowData',id);
                            var opt = "";
                            opt += "<input type='button' id='detail"+id+"' value='查看' onclick='getdetail("+id+")'/> ";
                            opt += "<input type='button' id='detail"+id+"' value='修改' onclick='updatedetail("+id+")'/> ";
                            opt += "<input type='button' id='del"+id+"' value='删除' onclick='del("+id+")'/> ";
                            $("#jqGrid").jqGrid('setRowData',id,{options:opt});
                        }

    隐藏表格中的某列:

    jQuery("#usedcar_table").setGridParam().hideCol("ColName");

  • 相关阅读:
    JavaScript优美的特性
    指尖初体验之主屏幕操作
    XHTML下css+div布局总结
    CSS表常用小技巧
    让两个DIV居中显示
    用CSS做滑动门
    CSS控制文本自动换行
    符合css规范的下拉菜单(兼容ff\ie6\ie7)
    层垂直居中于浏览器
    用css来强制按比例压缩图片的高度或宽度
  • 原文地址:https://www.cnblogs.com/ichemmwangd/p/5009063.html
Copyright © 2020-2023  润新知