jqGrid无法正确显示

问题描述

我正在使用jQuery网格插件jqGrid来显示数据数组.

I am using jQuery grid plugin , jqGrid, to show an array of data.

我想要实现的是1.默认情况下，该网格为空.2.当用户单击搜索按钮时，它将使用AJAX加载数据3.数据将加载到网格中.

What I want to achieve is1. by default, that grid is empty.2. when user clicks the search button, it will use AJAX to load data3. data will load into grid.

从附件中，我出现此错误

From the attachment, I have this error

1. 网格宽度不是100％px，而是两个小
2. 寻呼机未显示.如何使用控制寻呼机的方法?

如何解决?有样品吗?

谢谢

<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>

推荐答案

您可以使用autowidth: true选项控制宽度.从 jqGrid文档:

You can use the autowidth: true option to control width. From the jqGrid docs:

然后，您只需要确保您的父元素具有适当的宽度即可.

Then you just need to make sure that your parent element is of the appropriate width.

这篇关于jqGrid无法正确显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！