How do I implement jqgrid v3.7 in my webapplication created using cakephp 1.3

I am trying to implement jqgrid v3.7 in my webapplication created using cakephp v1.3.

My controller code is as follows

function admin_index()
{
    // get how many rows we want to have into the grid - rowNum parameter in the grid
    $limit = $this->params['url']['rows'];

    // get index row - i.e. user click to sort. At first time sortname parameter -
    // after that the index from colModel
    $sidx = $this->params['url']['sidx'];

    // sorting order - at first time sortorder
    $sord = $this->params['url']['sord'];

    // if we not pass at first time index use the first column for the index or what you want
    if( !$sidx ) $sidx = 1;

    // calculate the number of rows for the query. We need this for paging the result
    $row = $this->Constituency->find('count');
    $count = $row;

    // calculate the total pages for the query
    if( $count > 0 )
    {
        $total_pages = ceil($count / $limit);
    }
    else
    {
        $total_pages = 0;
    }

    // if for some reasons the requested page is greater than the total
    // set the requested page to total page
    if( $page > $total_pages ) $page = $total_pages;

    // calculate the starting position of the rows
    $start = $limit * $page - $limit;

    // if for some reasons start position is negative set it to 0
    // typical case is that the user type 0 for the requested page
    if( $start < 0 ) $start = 0;

    // the actual query for the grid data
    $limit_range = $start . "," . $limit;
    $sort_range = $sidx . " " . $sord;
    //$result = $this->Constituency->findAll(null, "id,name", $sort_range, $limit_range, 1, null);
    $this->Constituency->recursive = -1;
    $result = $this->Constituency->find('all', array(
        'fields' => array('id', 'name'),
        'order' => $sidx,
        'limit' => $start .",". $limit_range
    ));

    $i=0;
    $response->page = $page;
    $response->total = $total_pages;
    $response->records = $count;

    foreach($result as $result)
    {
        $response->rows[$i]['id'] = $result['Constituency']['id'];
        $responce->rows[$i]['cell']=array($result['Constituency']['id'],$result['Constituency']['name']);
        $i++;
    }

    echo json_encode($response);
}

the view file contains the following code

$this->Html->css('ui.jqgrid');
$this->Html->script('jquery.jqGrid.min');

<script type="text/javascript">
    $(document).ready(function(){
        $("#list").jqGrid(
        {
            url:'<?php echo $this->Html->url(array("controller" => "constituencies", "action" => "index")); ?>',
            datatype: "json",
            colNames:['Id','Name'],
            colModel:[
                {name:'id',index:'id', width:55},
                {name:'name',index:'name', width:90},
            ],
            rowNum:10,
            rowList:[10,20,30],
            pager: jQuery('#pager'),
            sortname: 'id',
            viewrecords: true,
            sortorder: "desc",
            caption:"Constituencies"
        });
        $("#list").navGrid("#pager",{edit:false,add:false,del:false});
    })
</script>

<div class="constituencies index">
    <h2><?php __('Constituencies'); ?></h2>
    <table id="list"  class="scroll"></table>
    <div id="pager"  class="scroll" ></div>
</div>

Now when I load the index action I get a lot of errors

Undefined index: rows Undefined index: sidx Undefined index: sord etc. etc.

Has anybody included jqgrid in a cakephp based application ?

How do开发者_StackOverflow中文版 I include the jqgrid in my application ? Please help me do this.

Thanks

I don't use cakephp myself, but probably two links http://www.trirand.com/blog/?page_id=393/help/integration-of-cakephp-and-jqgrid-tutorial/ and http://www.trirand.com/blog/?page_id=393/help/how-to-integrate-jqgrid-with-cakephp/ can be helpful for you.

The errors you're getting look like PHP errors. Try putting a debug($this->params); statement at the top of your view file to see what the controller is spitting out.

There was some incorrect values assigned in the find function for constituency model.

here is the correct complete working code:


THIS IS THE CONTROLLER CODE:

1.) Leave the function in which the grid is shown a blank like this

function index()
{

}

2.) Then create a new function for showing the grid with data like this :

function admin_showGrid()
{
    $this->autoRender = false;

    // get how many rows we want to have into the grid - rowNum parameter in the grid
    $limit = $this->params['url']['rows'];

    // get index row - i.e. user click to sort. At first time sortname parameter -
    // after that the index from colModel
    $sidx = $this->params['url']['sidx'];

    // sorting order - at first time sortorder
    $sord = $this->params['url']['sord'];

    $page = $this->params['url']['page'];

    // if we not pass at first time index use the first column for the index or what you want
    if( !$sidx ) $sidx = 1;

    // calculate the number of rows for the query. We need this for paging the result
    $row = $this->{Model_Name}->find('count');
    $count = $row;

    // calculate the total pages for the query
    if( $count > 0 )
    {
        $total_pages = ceil($count / $limit);
    }
    else
    {
        $total_pages = 0;
    }

    // if for some reasons the requested page is greater than the total
    // set the requested page to total page
    if( $page > $total_pages ) $page = $total_pages;

    // calculate the starting position of the rows
    $start = $limit * $page - $limit;

    // if for some reasons start position is negative set it to 0
    // typical case is that the user type 0 for the requested page
    if( $start < 0 ) $start = 0;

    // the actual query for the grid data
    $limit_range = $start . "," . $limit;
    $sort_range = $sidx . " " . $sord;
    //$result = $this->{Model_Name}->findAll(null, "id,name", $sort_range, $limit_range, 1, null);
    $this->{Model_Name}->recursive = -1;
    $result = $this->{Model_Name}->find('all', array(
        'fields' => array('id', 'name'),
        'order' => $sort_range,
        'limit' => $limit_range
    ));

    $i = 0;
    $response->page = $page;
    $response->total = $total_pages;
    $response->records = $count;

    foreach($result as $result)
    {
        $response->rows[$i]['id'] = $result['{Model_Name}']['id'];
        $response->rows[$i]['cell'] = array($result['{Model_Name}']['id'], $result['{Model_Name}']['name']);
        $i++;
    }

    echo json_encode($response);

    //writing exit() is necessary.
    exit();
}

THIS IS THE VIEW CODE:

1.) include the necessary files

echo $this->Html->css('ui.jqgrid');

echo $this->Html->script('grid.locale-en');
echo $this->Html->script('jquery.jqGrid.min');

2.) add the following javascript code in your VIEW file

<script type="text/javascript">
jQuery(document).ready(function(){
    jQuery("#list").jqGrid(
    /* '#list' is the ID of the table in which you want populated results */
    {
        url:'<?php echo $this->Html->url(array("controller" => "{Controller_Name}", "action" => "{Action_Name}")); ?>',
        datatype: "json",
        mtype: "GET",
        colNames:['Id','Name'],
        colModel:[
            {name:'id',index:'id', width:55},
            {name:'name',index:'name', width:90},
        ],
        rowNum:10,
        rowList:[10,20,30],
        pager: jQuery('#pager'), /* id of the pagination element */
        sortname: 'id',
        viewrecords: true,
        sortorder: "asc",
        caption:"Enter table Heading or the name you want to show for the table",
        height:"auto",
        autowidth: true
    });
    jQuery("#list").navGrid("#pager",{edit:false,add:false,del:false});
})
</script>

3.) And finally the HTML in the same view file

<table id="list" style="height:auto;"></table>
<div id="pager"></div>

If you still face any problems with the code above let me know.