Я использую jQuery grid plugin, jqGrid, чтобы показать массив данных.jqGrid отображается неправильно
Что я хочу достичь: 1. По умолчанию эта сетка пуста. 2. Когда пользователь нажимает кнопку поиска, он будет использовать AJAX для загрузки данных 3. данные будут загружаться в сетку.
От привязанности, у меня есть эта ошибка
- ширина сетки не 100% ПВ, это два маленьких
- пейджера не показывается. как использовать метод управления пейджером?
как исправить? есть какие-то образцы?
Благодаря
<h2>Search</h2>
<form id="project_search_form">
<table class="grid">
...
<tr>
<td><a class="form_button" onclick="searchProject();" href="#">search</a></td>
</tr>
</table>
</form>
<table id="projectList"></table>
<div id="projectPager"></div>
<script type="text/javascript">
$(document).ready(function(){
jQuery("#projectList").jqGrid({
url:'server.php?q=2',
datatype: "json",
colNames:['ID','Name'],
colModel:[ {name:'projectId',index:'id', width:55} , {name:'name',index:'name', width:55}],
rowNum:10,
rowList:[10,20,30],
pager: '#pager5',
sortname: 'id',
viewrecords: true,
sortorder: "desc",
caption:"Simple data manipulation",
editurl:"someurl.php" }).navGrid("#projectPager",{edit:false,add:false,del:false});
});
function searchProject(){
var param = $('#project_search_form').serialize();
BaseAjaxUtil.object_search(param,
{
callback:function(data){
var jsongridRows = eval("("+data+")");
for(var i = 0; i < jsongridRows.length; i++) {
var datarow = jsongridRows[i];
var su=jQuery("#projectList").jqGrid('addRowData',i+1, datarow);
// if(su) alert("Succes. Write custom code to add data in server"); else alert("Can not update");
}
},
errorHandler:function(errorString) { alert("error:"+errorString); }
}
);
}
</script>
Примечание. Ссылка на ID # pager5 как элемент, который будет содержать пейджер, но ваша разметка HTML не содержит элемент с идентификатором # pager5. Также есть много примеров здесь: http://www.trirand.com/blog/jqgrid/jqgrid.html –
да, вы правы. то как контролировать его ширину? – user595234