在浏览导航栏添加所需按钮
<!Doctype html> <html> <head> <meta charset = "utf-8"/> <title> demo </title> <link rel = "styleSheet" type = "text/css" href = " href = "css/jquery-ui.theme.min.css"/> <link rel = "styleSheet" type = "text/css" href = "css/ui.jqgrid-bootstrap-ui.css"/>> <link rel = "styleheet" Type = "text/css" href = "cscss /> </head> <body> <div id = "main"> <! - jqgrid所在 - > <table id = "grid-table"> </table> <! - jqgrid浏览导航栏所在 - > <div id = "grid-pager"> </div> </div> <script src = "js/jquery-1.11.0.min.js"/javascript "/javascript charset = "utf-8"> </scrip> <script src = "js/i18n/grid.locale-cn.js" type = "text/javascript" charset = "utf-8"> </scrip> <スクリプトsrc = "js/jquery.jqgrid.min.js type = "text/javascript"> // {id: "00003"、type: "退货出库"、pay: "1040.06"、name: "abc"、text: "ddd"}]; var grid_selector = "#grid-table"; var pager_selector = "#grid-pager"; $(document(document).read(){$( "#gridtable"){" //当データタイプ "" local "时需填写データ型:" local "、//数据来源、本地数据(ローカル、json、jsonp、xml 等) height:150、/高度 'auto' // mtype:" get "、// [{name: 'id'、index: 'id'、// // edittype: "select"、//可以编辑的类型。可选值:text、textarea、select、チェックボックス、パスワード、ボタン、画像、file.seditoptions:{value: "" 1:采购入库; 2:退用入库 "}}、{name: 'pay'、index: 'pay'、width:60、sorttype: 'bed:' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' ''、 150、編集可能:true、editoptions:{size: "20"、maxlength: "30"}}}、{name: 'text'、index: 'text'、width:250、sortable:false、editable:true、edittype: "textarea"、editoptions:{rows: "2"、 "10" "10" "10" "10" "10" 10 "" 10 "" 10 "10" 10 " // rownum:10、//每页显示记录数ローリスト:[10、20、30]、//用于改变显示行数的下拉列表框的元素数组。pager:pager_selector、// //是否只能点击复选框多选// subgrid:true、// sortname: 'id'、// // editable为editable 时才能显示属性) edit:true、//效果如下:
id的編集可能为false所以不能被编辑
下面是具体的检索选项
首先是/または
然后一般检索的包含选项有
pay的sorttype设置成了 "double”类型(int型也是一样、不过显示时会省略小数、请注意)所以 请注意)所以
检索是唯一能在不连接后台时使用成功的功能url
以上所述是jqgrid学习笔记整理 - - 进阶篇(一)。下篇jqgrid学习笔记整理 - - 进阶篇(二)、正式进入后台设计阶段、主要以最基本的mvc dao