无法使用JavaScript方法加载JQuery EasyUI datagrid [英] Cannot load JQuery EasyUI datagrid using JavaScript approach
问题描述
我使用JQuery EasyUI的datagrid是一个非常基本的实现。
I am using JQuery EasyUI's datagrid is a very basic implementation.
如果我使用内联方式加载数据,一切都很好,数据显示(注意JSON API正在运行,因为我已经在服务器上启用了CORS,这不是问题):
If I use the inline approach to loading in the data all is fine and the data shows (note the JSON API is working as I have enabled CORS on the server so that's not the issue):
<table class="easyui-datagrid"
data-options="url:'https://www.driverlive.co.uk/rest/api/PushMessage/GetPushDriverMessagesList?DeviceId=a99f8a977696bfb9&DateFrom=2014-10-27T00:00:00&DateTo=2015-11-11T00:00:00',method:'get',singleSelect:true,fit:true,fitColumns:true">
<thead>
<tr>
<th data-options="field:'PushDriverMessageDBID'" width="80">Item ID</th>
<th data-options="field:'PushDriverMessageGuid'" width="100">PushDriverMessageGuid</th>
<th data-options="field:'AppKey',align:'right'" width="80">AppKey</th>
<th data-options="field:'PushNotificationMessage',align:'right'" width="300">PushNotificationMessage</th>
<th data-options="field:'Sender'" width="150">Sender</th>
<th data-options="field:'MessageDated',align:'center'" width="50">MessageDated</th>
</tr>
</thead>
</table>
如果我尝试加载datagrid的JavaScript方式,我没有数据,但我不明白为什么? / p>
If I attempt the JavaScript way of loading the datagrid I get no data but I cannot understand why?
// Dispatching DataGrid
var JSONDispatchingURL = "https://www.driverlive.co.uk/rest/api/PushMessage/GetPushDriverMessagesList?DeviceId=a99f8a977696bfb9&DateFrom=2014-10-27T00:00:00&DateTo=2015-11-11T00:00:00";
$('#DGDispatching').datagrid({
url: JSONDispatchingURL,
columns: [[
{ field: 'PushDriverMessageDBID', title: 'PushDriverMessageDBID', width: 100 },
{ field: 'PushDriverMessageGuid', title: 'PushDriverMessageGuid', width: 100 },
{ field: 'AppKey', title: 'AppKey', width: 100 },
{ field: 'PushNotificationMessage', title: 'PushNotificationMessage', width: 100 },
{ field: 'Sender', title: 'Sender', width: 100 },
{ field: 'MessageDated', title: 'MessageDated', width: 100}
]]
});
我在JSFiddle中有同样的结果: http://jsfiddle.net/b6fxs2v2/1/
I have the same result with the JSFiddle here: http://jsfiddle.net/b6fxs2v2/1/
我已经按照这里的说明: http://www.jeasyui.com/documentation/datagrid.php 所以我'有点迷失了...
I have followed the instructions here: http://www.jeasyui.com/documentation/datagrid.php so I'm a bit lost...
推荐答案
好的。我启动了Fiddler,它表明JQuery EasyUI正在使用POST而不是GET来调用该服务。因此,REST API正在响应405.响应特别是{Message:请求的资源不支持http方法POST。}
OK. I fired up Fiddler and it showed that JQuery EasyUI was calling the service with POST rather than GET. The REST API was therefore responding with a 405. The response was specifically {"Message":"The requested resource does not support http method 'POST'."}
I发现类似的这个SO帖子然后修改我的代码如下。然后这样工作!
I found similar this SO post and then modified my code as below. This then worked!
var JSONDispatchingURL = "https://www.driverlive.co.uk/rest/api/PushMessage/GetPushDriverMessagesList?DeviceId=a99f8a977696bfb9&DateFrom=2014-10-27T00:00:00&DateTo=2015-11-11T00:00:00";
$('#DGDispatching').datagrid({
url: JSONDispatchingURL,
method: 'get',
columns: [[
{ field: 'PushDriverMessageDBID', title: 'PushDriverMessageDBID', width: 100 },
{ field: 'PushDriverMessageGuid', title: 'PushDriverMessageGuid', width: 100 },
{ field: 'AppKey', title: 'AppKey', width: 100 },
{ field: 'PushNotificationMessage', title: 'PushNotificationMessage', width: 100 },
{ field: 'Sender', title: 'Sender', width: 100 },
{ field: 'MessageDated', title: 'MessageDated', width: 100 }
]]
});
这篇关于无法使用JavaScript方法加载JQuery EasyUI datagrid的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!