jqGrid avec données JSON rend la table vide
https://stackoverflow.com/questions/259435
-
06-07-2019 - |
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
RussianQuestion
J'essaie de créer un jqgrid, mais le tableau est vide. Le tableau est rendu, mais les données ne s'affichent pas.
Les données que je récupère de l'appel php sont:
{
"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"]}
]}
La configuration javascript ressemble à ceci:
$("#"+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
});
Le code HTML ressemble à:
<table class="awardsList" id="awardsList2" class="scroll" name="awardsList" />
<div id="awardsList2_pager" class="scroll"></div>
Je ne suis pas sûr d'avoir besoin de définir jsonReader, car j'ai essayé de conserver les valeurs par défaut. Si le code php peut aider, je peux aussi le poster.
La solution
Je l'ai fait fonctionner!
Le champ type de données doit être type de données . C'est sensible à la casse.
Autres conseils
Le problème se produit également lorsque vous incluez le script jquery.jqGrid.min.js avant grid.locale-en.js . Cochez cette case s'il y a des problèmes avec l'appel de méthode du contrôleur.
J'ai rencontré le même problème lors de la migration de jqGrid 3.6 vers jqGrid 3.7.2. Le problème était que mon code JSON n'était pas correctement cité entre guillemets (comme l'exige la spécification JSON). jqGrid 3.6 a toléré mon JSON non valide, mais jqGrid 3.7 est plus strict.
Voir ici: http://simonwillison.net/2006/Oct/11/json /
non valide :
{
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"]}
]}
Valide :
{
"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"]}
]}
Je l'ai aussi fait fonctionner: le type de données est l'orthographe correcte - il est montré de cette façon dans l'exemple mais il est incompatible avec tout dans la bibliothèque, il était donc facile de se tromper
Je commence à être très fatigué à la recherche de cette documentation éparse et je sens vraiment que JSON, qui est juste et approprié pour être utilisé en JavaScript, a vraiment été brièvement couvert en faveur de XML. La combinaison de Python et de JavaScript, via JSON, est une combinaison très forte, mais elle est en lutte constante avec cette bibliothèque particulière.
Toute personne ayant une alternative qui:
1 > Prend correctement en charge les thèmes de l'interface utilisateur jQuery (y compris les coins arrondis!) ( http://datatables.net prend beaucoup mieux en charge les thèmes)
2 > Permet le redimensionnement des colonnes ( http://datatables.net ne prend pas en charge cette fonctionnalité immédiatement)
3 > Autorise les sous-réseaux ( http://datatables.net vous permet de faire ce que vous voulez ici, par le biais d'un événement)
s'il vous plaît faites le moi savoir. Je passe plus de temps sur cette partie de mon interface que sur la totalité de son contenu combiné, et c’est tout le temps que je passe à chercher des exemples concrets et à "essayer des choses". qui devient juste ennuyeux.
S
Il s’agit peut-être d’une publication plus ancienne, mais je publierai mes succès uniquement pour aider les autres.
Votre JSON doit être au format suivant:
{
"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"
]
}
]
}
et j'ai écrit ce modèle dans Zend pour que vous puissiez l'utiliser si vous en avez envie. Manipulez-le comme vous le souhaitez.
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;
}
Les gars veulent juste vous aider. Je me suis fait suivre:
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"] }
]};
// Marque en dessous de la ligne importante. type de données " jsonstring " a travaillé pour moi au lieu de "json".
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'}],
Cordialement,
Dans mon cas, le problème provenait de la ligne de code PHP suivante (extraite de la démo jqGrid):
$responce->page = $page;
Ce qui ne va pas, c'est que: j'accède à la page de propriétés de l'objet $ responce sans le créer auparavant. Apache a alors affiché le message d'erreur suivant:
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
Enfin, le message d'erreur était envoyé au lecteur JSON dans le script.
J'ai résolu le problème en créant un objet vide:
$responce = new stdClass();
Je ne pense pas que votre identifiant soit du type correct, je pense que ce devrait être un int.
Pour un json donné, vous n'avez vraiment pas besoin des paramètres de jsonreader. De toute façon, vous avez répertorié les valeurs par défaut. En outre, vous n'avez pas de sous-grille dans votre JSON.
Essayez ceci:
{
"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"]}
]}
Je travaillais avec WAMP 2.4, j'étais fou avec ce problème, j'ai essayé beaucoup de choses, comme installer les versions précédentes de PHP et comme la version 5.2, j'ai même essayé avec Windows XP et beaucoup d'options jqGrid. Eh bien merci à Oleg enfin et Mariusz je trouve la seule ligne:
$responce = new stdClass();
Avant que l'utilisation de $ responce puisse résoudre tous les problèmes, ma grille fonctionne à présent de manière géniale !!!
Merci mes amis.
