Question

我一直在关注http://trirand.com/blog/jqgrid/search3.html

中的示例

谁能看到我哪里出错了？

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>My First Grid</title>

<link rel="stylesheet" type="text/css" media="screen" href="http://trirand.com/blog/jqgrid/themes/redmond/jquery-ui-1.8.1.custom.css" />
<link rel="stylesheet" type="text/css" media="screen" href="includes/jquery/plugins/jqgrid/css/ui.jqgrid.css" />

<script src="includes/jquery/plugins/jqgrid/js/jquery-1.4.2.min.js" type="text/javascript"></script>
<script src="includes/jquery/plugins/jqgrid/js/i18n/grid.locale-en.js" type="text/javascript"></script>
<script src="includes/jquery/plugins/jqgrid/js/jquery.jqGrid.min.js" type="text/javascript"></script>

<script type="text/javascript">
$(function(){
  $("#list").jqGrid({
    url:'index.php/jqgrid/customer',
    datatype: 'json',
    mtype: 'GET',
    colNames:['ID','Creator', 'Firstname','Surname','Address 1','Address 2', 'Address 3', 'City', 'County', 'Postcode',
                'Country', 'Email', 'Home Tel', 'Mobile Tel', 'Work Tel', 'Notes'],
    colModel :[
      {name:'id', index:'id', width:55},
      {name:'creator_id', index:'creator_id', width:80},
      {name:'firstname', index:'firstname', width:80},
      {name:'surname', index:'surname', width:80},
      {name:'address_1', index:'address_1', width:80},
      {name:'address_2', index:'address_2', width:80},
      {name:'address_3', index:'address_3', width:80},
      {name:'city', index:'city', width:80},
      {name:'county', index:'county', width:80},
      {name:'postcode', index:'postcode', width:80},
      {name:'country', index:'country', width:80},
      {name:'email', index:'email', width:80},
      {name:'home_tel', index:'home_tel', width:80},
      {name:'mobile_tel', index:'mobile_tel', width:80},
      {name:'work_tel', index:'work_tel', width:80},
      {name:'notes', index:'notes', width:80}
    ],
    pager: '#pager',
    rowNum:10,
    rowList:[10,20,30],
    sortname: 'id',
    sortorder: 'desc',
    viewrecords: true,
    caption: 'My first grid'
  });
});

$("#list").jqGrid('navGrid','#pager',{edit:true,add:true,del:true,search:true,refresh:true});
$("#list").jqGrid('navButtonAdd',"#pager",{caption:"Toggle",title:"Toggle Search Toolbar", buttonicon :'ui-icon-pin-s',
        onClickButton:function(){
                $("#list")[0].toggleToolbar()
        }
});
$("#list").jqGrid('navButtonAdd',"#pager",{caption:"Clear",title:"Clear Search",buttonicon :'ui-icon-refresh',
        onClickButton:function(){
                $("#list")[0].clearToolbar()
        }
});
jQuery("#list").jqGrid('filterToolbar');

</script>

</head>
<body>
<table id="list"></table>
<div id="pager"></div>
</body>
</html>

示例是加载所有css，js文件并输入数据。但是不会在底部工具栏上显示任何按钮或在顶部添加搜索工具栏。

Answer 1

只需更改

$（ “＃清单”）的jqGrid（ 'navGrid'， '＃寻呼机'，{编辑：真，添加：真，德尔：真，搜索：真，刷新：真}）;

与

jQuery（“＃list”）。jqGrid（'navGrid'，'＃list-pager'，{del：true，add：true，edit：true}，{}，{modal：true，afterSubmit：processAddEdit， afterComplete：reloadJqGrid，recreateForm：true}，{}，{multipleSearch：true}）;

希望它有效。只是想到不同的语法，试着不太确定..

无法获得jqGrid集成搜索工具栏吗？

1 个答案: