jqgrid: порожня сітка з викликом json

У мене порожня сітка з jQuery + jqgrid + PHP + json.

Мій grid.local-xx є перед jqgrid lib

script = "text/javascript" src = "/ v2/back/js/jquery.min.js

сценарій type = "text/javascript" src = "/ v2/back/js/jqgrid/grid.locale-fr.js

сценарій type = "text/javascript" src = "/ v2/back/js/jqgrid/jquery.jqGrid.min.js

Ось відповідь json:

{"page":null,"total":0,"records":7,"rows":[{"id":"1","cell":["","GRATUIT",null,null,null,null,"Actif","setOptions<\/a>"]},{"id":"2","cell":["","PACK 1","30",null,null,null,"Actif","setOptions<\/a>"]},{"id":"3","cell":["","PACK 2","50",null,null,null,"Actif","setOptions<\/a>"]},{"id":"4","cell":["","PACK 3","70",null,null,null,"Actif","setOptions<\/a>"]},{"id":"5","cell":["","PACK 4","90",null,null,null,"Actif","setOptions<\/a>"]},{"id":"6","cell":["","PACK 5","150",null,null,null,"Actif","setOptions<\/a>"]},{"id":"8","cell":["","Pack 6","1",null,null,null,"Actif","setOptions<\/a>"]}]}

А ось мій дзвінок javascript:

<div id="liste">
<div id="messagebox"></div>
<div id="filter"></div>
<table id="list" class="scroll" cellpadding="0" cellspacing="0"></table>
<div id="pager" class="scroll" style="text-align:center;"></div>
<script type="text/javascript">
$(document).ready(function(){
   $("#list").jqGrid({
        url:'/admin/pack/showgrid/',
        datatype: 'json',
        mtype: 'POST',
        colNames:['','Libellé', 'Montant','Montant Promo','Du','Au','Etat','Option'],
        colModel:[
            {name:'edition',index:'edition', sortable:false,editable: false,width:10, align:"center"},
            {name:'pack_libelle',index:'pack_libelle', sortable:true, editable: true,width:120, align:"center"},
            {name:'pack_montantHT',index:'pack_montantHT', sortable:true, editable: true,width:120, align:"center"},
            {name:'pack_montantPromoHT',index:'pack_montantPromoHT', sortable:true, editable: true,width:140, align:"center"},
            {name:'pack_dateDebutPromotion',index:'pack_dateDebutPromotion', sortable:true, editable: true,width:160, align:"center"},
            {name:'pack_dateFinPromotion',index:'pack_dateFinPromotion', sortable:true, editable: true,width:160, align:"center"},
            {name:'pack_isActif',index:'pack_isActif', editable: true,width:120, align:"center",edittype:'select',editoptions:{value:"1:Actif;0:Inactif"}},
            {name:'pack_option',index:'pack_option', editable: false,width:120, align:"center"}
        ],
        pager: '#pager',
        rowNum:10,
        rowList:[10,20,30],
        sortname: 'pack_isActif',
        viewrecords: true,
        autowidth: true,
        rownumbers: false,
        gridview : true,
        sortorder: "desc",
        caption:"Liste des packs activés ou désactivés"
        });
      jQuery("#list").jqGrid('navGrid','#pager',{edit:false,add:false,del:false,search:false,refresh:false});

    jQuery("#list").jqGrid('navButtonAdd',"#pager",
        {caption:"Add", title:"Ajouter un nouveau pack", buttonicon:'ui-icon-plus',
            onClickButton:function(){
                jQuery("#list").editGridRow( "new", {
                    url:'/v2/admin/pack/insert',
                    top:250,
                    left:500,
                    height:280,
                    width:500,
                    closeAfterAdd:true,
                    reloadAfterAdd:true                        
                } );
            }
        }
     );      

    jQuery("#list").jqGrid('navButtonAdd',"#pager",
        {caption:"Modif.",title:"Modifier un enregistrement",buttonicon:'ui-icon-pencil',
            onClickButton:function(){
                var gr = jQuery("#list").jqGrid('getGridParam','selrow');
                if( gr != null ){
                    jQuery("#list").jqGrid('editGridRow',gr,{
                        height:280,
                        width:500,
                        reloadAfterSubmit:true,
                        url:'/v2/admin/pack/edit',
                        top:250,
                        left:500,
                        closeAfterEdit:true,
                        processData: "Chargement..."
                    });
                }else{
                    alert("Choisir un enrégistrement s'il vous plaît. \r\nMerci");
                }
            }
        }
     );

    jQuery("#list").jqGrid('navButtonAdd',"#pager",
        {caption:"Suppr.",title:"Supprimer un enregistrement",buttonicon:'ui-icon-trash',
            onClickButton:function(){
                var gr = jQuery("#list").jqGrid('getGridParam','selrow');
                if( gr != null ){
                    jQuery("#list").delGridRow( gr, {
                            caption: "Suppression",
                            top:250,
                            left:500,
                            msg: "Vous êtes sûr ?",
                            url:'/admin/pack/delete/',
                            processData: "Chargement..."
                    } );
                }else{
                    alert("Choisir un enrégistrement s'il vous plaît. \r\nMerci");
                }
            }
        }
     );
});

The layout is generate, the three buttons are added... but the grid is empty.

Anyone can help me ?

1

1 Відповіді

I recommend you to look at another part of your code which you not posted here because your code can do read the JSON data which you posted. See the demo. Some changes like usage of "page":1,"total":1 instead of "page":null,"total":0 in the JSON data, closing tag for <div id="liste"> (if it is not exist) and some other changes would be recommended, but I am not think that it is your main problem.

One of the typical possible reason could be the value of "Content-Type" header of the HTTP response which should be application/json. In any way I would recommend you to include loadError callback/event in the jqGrid. See the answer for more details.

1
додано
Я залишаю цей проект ... це занадто брудно. Основною проблемою є проект, який використовує цей jqgrid абсолютно жахливо. Він був розроблений з пальцями, і я знайшов дві помилки на всіх сторінках ... Дякуємо за вашу допомогу
додано Автор Raphaël, джерело
@ Рафаель: Ласкаво просимо!
додано Автор Oleg, джерело
ІТ КПІ - JavaScript
ІТ КПІ - JavaScript
504 учасників

співтовариство javascript розробників в Telegram