jqGrid 学习笔记整理——进阶篇(一 )

2020-05-29 07:14:15易采站长站整理

name: 'text',
index: 'text',
width: 250,
sortable: false,
editable: true,
edittype: "textarea",
editoptions: {
rows: "2",
cols: "10"
}
}, ],
viewrecords: true, //是否在浏览导航栏显示记录总数
rowNum: 10, //每页显示记录数
rowList: [10, 20, 30], //用于改变显示行数的下拉列表框的元素数组。
pager: pager_selector, //分页、按钮所在的浏览导航栏
altRows: true, //设置为交替行表格,默认为false
//toppager: true,//是否在上面显示浏览导航栏
multiselect: true, //是否多选
//multikey: "ctrlKey",//是否只能用Ctrl按键多选
multiboxonly: true, //是否只能点击复选框多选
// subGrid : true,
//sortname:'id',//默认的排序列名
//sortorder:'asc',//默认的排序方式(asc升序,desc降序)
caption: "采购退货单列表", //表名
autowidth: true //自动宽
});
//浏览导航栏添加功能部分代码
$(grid_selector).navGrid(pager_selector, {
search: true, // 检索
add: true, //添加 (只有editable为true时才能显示属性)
edit: true, //修改(只有editable为true时才能显示属性)
del: true, //删除
refresh: true //刷新
}, {}, // edit options
{}, // add options
{}, // delete options
{
multipleSearch: true
} // search options - define multiple search
);
});
</script>
</body>
</html>

效果如下:

demo

id的editable为false 所以不能被编辑

add

edit

 del

search

下面是具体的检索选项

首先是 所有/任意 对应逻辑为AND/OR

然后一般检索的包含选项有

string

本例中把pay的sorttype设置成了 “double”类型 (int型也是一样,不过显示时会省略小数,请注意)所以 选项变为

double,int

检索是唯一能在不连接后台时使用成功的功能 其他功能都会提示设置url

以上所述是jqGrid 学习笔记整理——进阶篇(一 )。下篇jqGrid 学习笔记整理——进阶篇(二),正式进入后台设计阶段,主要以最基本的MVC DAO包的设计模式 面向初学。