jquery easyui datagrid 使用 method 'loadData' 显示不了json数据
更新，我用下面的代码重新运行了一下，现在能加载上json数据了，但是查看网页源代码能看到元素，网页中却显示空白。这是最新的问题。
我自己定义了一个loaddata函数，里面GET方法得到json数据（能成功），但是在回调函数里面使用datagrid的'loadData'方法无法将数据显示出来，查看网页元素显示相应的表是空的。请问这是怎么回事？下面是相应的代码。
这个是datagrid的定义函数
javascript@(category:String) <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title id="category">@category</title> <link rel="stylesheet" type="text/css" href="@routes.Assets.at("themes/default/easyui.css")"> <link rel="stylesheet" type="text/css" href="@routes.Assets.at("themes/icon.css")"> <style type="text/css"> body { margin: 0px; } a { color: #21759b; text-decoration: none; } a:hover { color: #0f3647; text-decoration: underline; } </style> <script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script> <script type="text/javascript" src="@routes.Assets.at("js/jquery.easyui.min.js")"></script> <script type="text/javascript" src="@routes.Assets.at("js/datagrid-scrollview.js")"></script> @*<script type="text/javascript" src="@routes.Assets.at(js/jquery.flot.min.js)"></script>*@ @*<script type="text/javascript" src="@routes.Assets.at(js/jquery.flot.time.min.js)"></script>*@ <script type="text/javascript" src="@routes.Assets.at("js/jquery.mousewheel.min.js")"></script> <script type="text/javascript"> var field; //当前排序字段 var rows; //数据 var scrollLeft = 0; //横向滚动条位置，可恢复 var scrollEvent = function(e) { //滚动条事件 scrollLeft = $(this).scrollLeft(); }; //阻止连带滚动外部窗口 var preventScrollParent = function(e, d) { var t = $(this); if (d > 0 && t.scrollTop() <= 0) { e.preventDefault(); } else { if (d < 0 && (t.scrollTop() >= t.get(0).scrollHeight - t.innerHeight())) { e.preventDefault(); } } }; $(function () { field = "commentnum" ; $("#dg").width($(self).width()) .height($(self).height()) .datagrid({ // url: "http://localhost:9000/json/"+ $("#category" ).text() + "/" + field, // method:"GET", loadMsg : 'Loading', view : scrollview, idField: 'id', pageSize : 50, autoRowHeight : false, rownumbers : true, singleSelect : true, border : false, striped : true, onLoadSuccess : loadFinish // columns:[[ // {field:'id',title:'id',width:100}, // {field:'name',title:'名字',width:400}, // {field:'url',title:'访问购买',width:220,align:'right'}, // // {field:'imgsrc',title:'图片',width:100,align:'right'}, // {field:'price',title:'价格',width:60,align:'right'}, // {field:'commentnum',title:'评论数',width:60,align:'right'}, // {field:'likerate',title:'好评率',width:60,align:'right'}, // {field:'category',title:'品类',width:60,align:'right'} // ]] }); setTimeout(loaddata, 50); }); //加载某列排序的数据 function loaddata() { $("#dg").datagrid("loading"); $.getJSON("http://localhost:9000/json/"+ $("#category" ).text() + "/" + field, {}, function(result) { rows = result.rows; $("#dg").datagrid('loadData', rows); }); } //加载完成后处理 function loadFinish() { $("#dg").datagrid("loaded"); $(".datagrid-view2 .datagrid-body").scrollLeft(scrollLeft); $(".datagrid-header-row>td").css("font-weight", "normal"); $(".datagrid-header-row>td[field='" + field + "'").css("font-weight", "bold"); $(".datagrid-header-row>td").click(function() { clickTitle($(this)); }); $(".datagrid-row a").click(function(e) { e.stopPropagation(); }) $(".datagrid-view2 .datagrid-body").scroll(scrollEvent); $(".datagrid-view2 .datagrid-body").bind('mousewheel', preventScrollParent); } //标题点击排序事件 function clickTitle(title) { if (title.attr("field") && title.attr("field") != field && (title.attr("field") == "price"||title.attr("field")=="likerate"||title.attr("field")=="commentnum")) { scrollLeft = $(".datagrid-view2 .datagrid-body").scrollLeft(); field = title.attr("field"); $(".datagrid-view2 .datagrid-body").unbind("scroll", scrollEvent); $(".datagrid-view2 .datagrid-body").unbind('mousewheel', preventScrollParent); loaddata(); } } //当前排序列加粗 function cellStyle(colname) { return function(value, row, index) { if (colname == field) return 'font-weight:bold;'; else return ''; } } </script> </head> <body> <table id="dg"> <thead> <tr> <th data-options="field:'id'" width="100">ID</th> <th data-options="field:'name'" width="100">名字</th> <th data-options="field:'url'" width="100">访问网页</th> <th data-options="field:'price'" width="100">价格</th> <th data-options="field:'commentnum'" width="100">评价数</th> <th data-options="field:'likerate'" width="100">好评率</th> <th data-options="field:'category'" width="100">品类</th> </tr> </thead> </table> </body> </html>
菲莉丝·艾利斯
10 years ago
