Search code examples
javascriptjqgrid

error on create jqgrid local


I'm try create a jqgrid local:

This is my code:

  var mydata=
        [
         {example1:"example1", example2:"2007-10-01",example3:"example "},
        ]
    $("#grid_plan_accion").jqGrid({
        datatype:'local',
        data: mydata,
        colNames:['example1', 'example2',' example3'],
        colModel:[
            { label: 'example1', name: 'example1', width: 20, sorttype:"string", editable:true},
            { label: 'example2', name: 'example2', width: 20, sorttype:"string", editable:true},
            { label: 'example3', name: 'example3', width: 20, sorttype:"string", editable:true},
        ],
        rowNum:10,
        pager: '#pager_plan_accion',
        editurl: 'clientArray',
        width: 150,
        height: 150,
        shrinkToFit: true,

    });

i dont get errors, only dont show the jqgrid, i dont know what is my error?, please any suggest or link for create an example, thanks


Solution

  •         var mydata =
                [
                    { example1: "example1", example2: "2007-10-01", example3: "example " },
                ]
    
            $("#grid_plan_accion").jqGrid({
                datatype: 'json',
                data: mydata,
                colNames: ['example1', 'example2', ' example3'],
                colModel: [
                    { label: 'example1', name: 'example1', width: 150, sorttype: "string", editable: true },
                    { label: 'example2', name: 'example2', width: 150, sorttype: "string", editable: true },
                    { label: 'example3', name: 'example3', width: 150, sorttype: "string", editable: true },
                ],
                rowNum: 10,
                height: 250,
                shrinkToFit: true,
    
            });
            for (var i = 0; i <= mydata.length; i++)
                jQuery("#grid_plan_accion").jqGrid('addRowData', i + 1, mydata[i]);
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jqgrid/4.6.0/js/jquery.jqGrid.min.js"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqgrid/4.6.0/css/ui.jqgrid.css" />
    <table id="grid_plan_accion"></table>