为什么jquery-easyui网格不显示列数据？

Question

我一直在尝试使用http://www.jeasyui.com/documentation/index.php的jquery-easyui datagrid。文档声明网格将接受json数据，我已经尝试实现了这一点，但是列从未在网格中呈现。

网格显示了适当的行数，每行都有一个行id，但是所有其他数据都被省略了。不知何故，网格正在读取json数据，并知道适当的行数，但不会呈现列数据。

我的json看起来像这样...

{"total":2,
 "rows":[
     {"id":"1",
      "name":"Employee One",
      "number":"1",
      "description":"This is the first Employee"
     },
     {"id":"2",
      "name":"Employee Two",
      "number":"2",
      "description":"This is the Second Employee"
     }
     ]
}

我的html是这样的.

 <table id="dg" title="Surveys" class="easyui-datagrid" style="width:550px;height:250px"  
    url="listJson2"  
    toolbar="#toolbar"  
    rownumbers="true" fitColumns="true" singleSelect="true">  
  <thead>  
    <tr>  
        <th field="id" width="20">Id</th>  
        <th field="name" width="50">Name</th>  
        <th field="number" width="50">Number</th>  
        <th field="description" width="50">Description</th>  
    </tr>  
  </thead>  
 </table>

我相信所有对js和css文件的引用都是正确的。网格在浏览器中渲染得很好。所有的按钮都在那里，我甚至有了正确的rows....just数，单元格中没有数据。

Answer 1

我也遇到了同样的问题，我发现如果通过css将表格的宽度默认设置为100%，那么它将不起作用。

我知道这个问题有点老生常谈，但可能会对其他人有所帮助。

Answer 2

试试loadData，

var list=[
            {"id":"1",
                "name":"Employee One",
                "number":"1",
                "description":"This is the first Employee"
               },
               {"id":"2",
                "name":"Employee Two",
                "number":"2",
                "description":"This is the Second Employee"
               }
               ];

$('#dg').datagrid('loadData', list);