JSONデータを含むjqGridはテーブルを空としてレンダリングします
-
06-07-2019 - |
質問
jqgridを作成しようとしていますが、テーブルが空です。テーブルは表示されますが、データは表示されません。
php呼び出しから返されるデータは次のとおりです。
{
"page":"1",
"total":1,
"records":"10",
"rows":[
{"id":"2:1","cell":["1","image","Chief Scout","Highest Award test","0"]},
{"id":"2:2","cell":["2","image","Link Badge","When you are invested as a Scout, you may be eligible to receive a Link Badge. (See page 45)","0"]},
{"id":"2:3","cell":["3","image","Pioneer Scout","Upon completion of requirements, the youth is invested as a Pioneer Scout","0"]},
{"id":"2:4","cell":["4","image","Voyageur Scout Award","Voyageur Scout Award is the right after Pioneer Scout.","0"]},
{"id":"2:5","cell":["5","image","Voyageur Citizenship","Learning about and caring for your community.","0"]},
{"id":"2:6","cell":["6","image","Fish and Wildlife","Demonstrate your knowledge and involvement in fish and wildlife management.","0"]},
{"id":"2:7","cell":["7","image","Photography","To recognize photography knowledge and skills","0"]},
{"id":"2:8","cell":["8","image","Recycling","Demonstrate your knowledge and involvement in Recycling","0"]},
{"id":"2:10","cell":["10","image","Voyageur Leadership ","Show leadership ability","0"]},
{"id":"2:11","cell":["11","image","World Conservation","World Conservation Badge","0"]}
]}
javascriptの構成は次のようになります。
$("#"+tableId).jqGrid ({
url:'getAwards.php?id='+classId,
dataType : 'json',
mtype:'POST',
colNames:['Id','Badge','Name','Description',''],
colModel : [
{name:'awardId', width:30, sortable:true, align:'center'},
{name:'badge', width:40, sortable:false, align:'center'},
{name:'name', width:180, sortable:true, align:'left'},
{name:'description', width:380, sortable:true, align:'left'},
{name:'selected', width:0, sortable:false, align:'center'}
],
sortname: "awardId",
sortorder: "asc",
pager: $('#'+tableId+'_pager'),
rowNum:15,
rowList:[15,30,50],
caption: 'Awards',
viewrecords:true,
imgpath: 'scripts/jqGrid/themes/green/images',
jsonReader : {
root: "rows",
page: "page",
total: "total",
records: "records",
repeatitems: true,
cell: "cell",
id: "id",
userdata: "userdata",
subgrid: {root:"rows", repeatitems: true, cell:"cell" }
},
width: 700,
height: 200
});
HTMLは次のようになります。
<table class="awardsList" id="awardsList2" class="scroll" name="awardsList" />
<div id="awardsList2_pager" class="scroll"></div>
デフォルトのままにしようとしたため、jsonReaderを定義する必要があるかどうかわかりません。 PHPコードが役立つ場合は、投稿することもできます。
解決
動作するようになりました!
dataType フィールドは datatype である必要があります。大文字と小文字が区別されます。
他のヒント
この問題は、 grid.locale-en.js の前にスクリプト jquery.jqGrid.min.js を含める場合にも発生します。コントローラのメソッド呼び出しに問題がある場合は、これを確認してください。
jqGrid 3.6からjqGrid 3.7.2に移行するときに同じ問題が発生しました。問題は、JSONが適切に二重引用符で囲まれていないことです(JSON仕様で要求されているように)。 jqGrid 3.6は無効なJSONを許容しましたが、jqGrid 3.7はより厳密です。
こちらを参照: http://simonwillison.net/2006/Oct/11/json /
無効:
{
page:"1",
total:1,
records:"10",
rows:[
{"id":"2:1","cell":["1","image","Chief Scout","Highest Award test","0"]},
{"id":"2:2","cell":["2","image","Link Badge","When you are invested as a Scout, you may be eligible to receive a Link Badge. (See page 45)","0"]},
{"id":"2:3","cell":["3","image","Pioneer Scout","Upon completion of requirements, the youth is invested as a Pioneer Scout","0"]}
]}
有効:
{
"page":"1",
"total":1,
"records":"10",
"rows":[
{"id":"2:1","cell":["1","image","Chief Scout","Highest Award test","0"]},
{"id":"2:2","cell":["2","image","Link Badge","When you are invested as a Scout, you may be eligible to receive a Link Badge. (See page 45)","0"]},
{"id":"2:3","cell":["3","image","Pioneer Scout","Upon completion of requirements, the youth is invested as a Pioneer Scout","0"]}
]}
また動作するようになりました:データ型は正しいスペルです-例ではそのように表示されていますが、ライブラリの他のすべてと矛盾しているので、間違えやすいです
このまばらなドキュメントを探し回るのは非常にうんざりしており、JavaScriptで使用するのが適切で適切なJSONは、XMLを支持して短い範囲で提供されているように感じます。 JSONを介したPythonとJavaScriptの組み合わせは、非常に強力な組み合わせですが、この特定のライブラリとの絶え間ない戦いです。
次のような代替手段を持っている人:
1&gt; jQuery UIテーマ(角丸を含む!)を適切にサポートします( http://datatables.net には、テーマに対するより優れたサポートがあります)
2&gt;列のサイズ変更を許可します( http://datatables.net はすぐにこれをサポートしません)
3&gt;サブグリッドを許可します( http://datatables.net を使用すると、イベントを通じてここで何でもできます)。 p>
お知らせください。インターフェースの残りの部分全体よりも、インターフェースのこの部分に多くの時間を費やしており、実際の例の検索と「物事の試行」に費やしている時間です。迷惑になっています。
S
これは古い投稿かもしれませんが、他の人を助けるためだけに成功を投稿します。
JSONは次の形式である必要があります:
{
"rows": [
{
"id": 1,
"cell": [
1,
"lname",
"fname",
"mi",
phone,
"cell1",
"cell2",
"address",
"email"
]
},
{
"id": 2,
"cell": [
2,
"lname",
"fname",
"mi",
phone,
"cell1",
"cell2",
"address",
"email"
]
}
]
}
このモデルはZendで作成したので、気になったら使用できます。好きなように操作します。
public function fetchall ($sid, $sord)
{
$select = $this->getDbTable()->select(Zend_Db_Table::SELECT_WITH_FROM_PART);
$select->setIntegrityCheck(false)
->join('Subdiv', 'Subdiv.SID = Contacts.SID', array("RepLastName" => "LastName",
"Subdivision" => "Subdivision",
"RepFirstName" => "FirstName"))
->order($sid . " ". $sord);
$resultset = $this->getDbTable()->fetchAll($select);
$i=0;
foreach ($resultset as $row) {
$entry = new Application_Model_Contacts();
$entry->setId($row->id);
$entry->setLastName($row->LastName);
$entry->setFirstName1($row->FirstName1);
$entry->setFirstName2($row->FirstName2);
$entry->setHomePhone($row->HomePhone);
$entry->setCell1($row->Cell1);
$entry->setCell2($row->Cell2);
$entry->setAddress($row->Address);
$entry->setSubdivision($row->Subdivision);
$entry->setRepName($row->RepFirstName . " " . $row->RepLastName);
$entry->setEmail1($row->Email1);
$entry->setEmail2($row->Email2);
$response['rows'][$i]['id'] = $entry->getId(); //id
$response['rows'][$i]['cell'] = array (
$entry->getId(),
$entry->getLastName(),
$entry->getFirstName1(),
$entry->getFirstName2(),
$entry->getHomePhone(),
$entry->getCell1(),
$entry->getCell2(),
$entry->getAddress(),
$entry->getSubdivision(),
$entry->getRepName(),
$entry->getEmail1(),
$entry->getEmail2()
);
$i++;
}
return $response;
}
皆さんはこれであなたを助けたいだけです。私は次の仕事を得ました:
JSON
var mydata1 = { "page": "1", "total": 1, "records": "4","rows": [{ "id": 1, "cell": ["1", "cell11", "values1" ] },
{ "id": 2, "cell": ["2", "cell21", "values1"] },
{ "id": 3, "cell": ["3", "cell21", "values1"] },
{ "id": 4, "cell": ["4", "cell21", "values1"] }
]};
//重要な行の下にマークを付けます。データ型&quot; jsonstring&quot; &quot; json&quot;の代わりに私のために働いた。
datatype: "jsonstring",
contentType: "application/json; charset=utf-8",
datastr: mydata1,
colNames: ['Id1', 'Name1', 'Values1'],
colModel: [
{ name: 'id1', index: 'id1', width: 55 },
{ name: 'name1', index: 'name1', width: 80, align: 'right', sorttype: 'string' },
{ name: 'values1', index: 'values1', width: 80, align: 'right', sorttype: 'string'}],
よろしく、
私の場合、問題はPHPコードの次の行(jqGridデモから取られた)によって引き起こされました:
$responce->page = $page;
ここで間違っているのは、最初に作成せずにオブジェクト $ responce
のプロパティページにアクセスしていることです。これにより、Apacheは次のエラーメッセージを表示しました。
Strict Standards: Creating default object from empty value in /home/mariusz/public_html/rezerwacja/apps/frontend/modules/service/actions/actions.class.php on line 35
そして最後に、エラーメッセージはスクリプト内のJSONリーダーに送信されていました。
空のオブジェクトを作成して問題を修正しました:
$responce = new stdClass();
あなたのIDは正しいタイプではないと思います。int型である必要があると思います。
指定されたjsonについては、jsonreaderの設定は本当に必要ありません。あなたがリストしたのはとにかくデフォルトであり、あなたのjsonにはサブグリッドがありません。
これを試してください:
{
"page":"1",
"total":1,
"records":"10",
"rows":[
{"id":1 ,"cell":["1","image","Chief Scout","Highest Award test","0"]},
{"id":2,"cell":["2","image","Link Badge","When you are invested as a Scout, you maybe eligible to receive a Link Badge. (See page 45)","0"]},
{"id":3,"cell":["3","image","Pioneer Scout","Upon completion of requirements, the youth is invested as a Pioneer Scout","0"]},
{"id":4,"cell":["4","image","Voyageur Scout Award","Voyageur Scout Award is the right after Pioneer Scout.","0"]},
{"id":5,"cell":["5","image","Voyageur Citizenship","Learning about and caring for your community.","0"]},
{"id":6,"cell":["6","image","Fish and Wildlife","Demonstrate your knowledge and involvement in fish and wildlife management.","0"]},
{"id":7,"cell":["7","image","Photography","To recognize photography knowledge and skills","0"]},
{"id":8,"cell":["8","image","Recycling","Demonstrate your knowledge and involvement in Recycling","0"]},
{"id":9,"cell":["10","image","Voyageur Leadership ","Show leadership ability","0"]},
{"id":10,"cell":["11","image","World Conservation","World Conservation Badge","0"]}
]}
私はWAMP 2.4で作業していましたが、この問題に夢中になりました。以前のバージョンのPHPのインストールや5.2など、Windows XPで試したものや、jqGridオプションをたくさん試しました。 最後にオレグとマリウスに感謝します。私は唯一の行を見つけました:
$responce = new stdClass();
$ responceを使用することですべてが解決する前に、グリッドが機能するようになりました!!!
友人に感謝します。