jqGrid lädt nicht json Daten von Remote-URL

Question

Ich habe einen jqGrid in jsFiddle einzurichten:

$("#list").jqGrid({ 
      height: 700, 
      width: 900, 
      datatype: 'json', 
      mtype:'GET', 
      url: url, 
      colNames:['Col 1','Col 2'], 
      colModel :[ 
       {name:'col1', index:'col1'}, 
       {name:'col2', index:'col2'}, 
      ], 
      pager: '#pager_list', 
      rowNum:20, 
      rowList:[20,50,100], 
      viewrecords: true, 
      caption: 'Test', 
      gridview : true,  
      }); 

http://jsfiddle.net/rw5hogz3/11

Es wird jedoch nicht json Daten von der Remote-URL laden. Der JSON scheint in einem Browser geladen zu sein.

Es funktioniert jedoch, wenn ich sowohl das jqgrid und Json-Skript auf localhost hosten. Hat jemand so etwas schon einmal erlebt? Jede Hilfe wird sehr geschätzt :)

Answer 1

Sie müssen CORS auf Ihrem Server aktivieren. dies auf der Seite setzen, die die JSON

<?php 
header("Access-Control-Allow-Origin: *"); 

zurückkehren Wenn Sie einen Rahmen verwenden, wird dies etwas komplizierter sein.

Aber einfach google CORS, um mehr zu erfahren.

Sie könnten auch Madalins Vorschlag von JSONP-Datentyp versuchen. Aber in jqgrid ist es nicht so einfach, nur 'jsonp' in den Datentyp einzugeben. Sie müssen es in den ajaxGridOptions tun ...

$("#list").jqGrid({ 
      height: 700, 
      width: 900, 
      datatype: 'json', 
      ajaxGridOptions: { jsonp: true, contentType: 'application/json; charset=utf-8' }, 
      mtype:'GET', 
      // rest of your code 

Dies wahrscheinlich nicht funktionieren obwohl, wie Sie wahrscheinlich immer noch eine Art von CORS Fehler

Answer 2

JSONP für Kreuz Versuchen Sie bekommen - Anfordern

Verwenden

$("#list").jqGrid({ 
       height: 700, 
       width: 900, 
       datatype: 'json', 
       mtype:'GET', 
       url: "http://202.137.146.116/tokoweblink/weblink.php?q=1&agent=ABVT0010", 
       ajaxGridOptions: { jsonp: true, contentType: 'application/json; charset=utf-8' }, 
       colNames:['Inv No', 'Client', 'Amount'], 
       colModel:[ 
         {name:'id',index:'id', width:55}, 
         {name:'name',index:'name asc, invdate', width:100}, 
         {name:'amount',index:'amount', width:80, align:"right"} 
         ], 
       }); 

Spalte zuweisen Modellname, Index mit JSON-Schlüssel val.