Question

我试图用codeigniter实现jqGrid。我设置了一切，它似乎是正确的，网格显示但没有加载任何信息。构造Json结构的控制器打印以下内容：

{"page":1,"total":1,"records":2,"rows":[{"id":"132","cell":["user1","user1@yahoo.com","1123","22767830","22767830","address"]},{"id":"12222","cell":["user2","user2@gmail.com","212222","8888888","888888","address2"]}]}

这意味着正确访问数据库，并且创建JSON没有问题。

但是网格没有显示这些信息，所以我打印了JSON，然后网格显示没有信息。

以下是控制器的代码：

function loadData(){           

        $page = isset($_POST['page'])?$_POST['page']:1; 
        $limit = isset($_POST['rows'])?$_POST['rows']:10; 
        $sidx = isset($_POST['sidx'])?$_POST['sidx']:'name'; 
        $sord = isset($_POST['sord'])?$_POST['sord']:'';         
        $start = $limit*$page - $limit; 
        $start = ($start<0)?0:$start; 

        $where = ""; 
        $searchField = isset($_POST['searchField']) ? $_POST['searchField'] : false;
        $searchOper = isset($_POST['searchOper']) ? $_POST['searchOper']: false;
        $searchString = isset($_POST['searchString']) ? $_POST['searchString'] : false;

        /**************************/


        //array to translate the search type
        $ops = array(
                'eq'=>'=', //equal
                'ne'=>'<>',//not equal
                'lt'=>'<', //less than
                'le'=>'<=',//less than or equal
                'gt'=>'>', //greater than
                'ge'=>'>=',//greater than or equal
                'bw'=>'LIKE', //begins with
                'bn'=>'NOT LIKE', //doesn't begin with
                'in'=>'LIKE', //is in
                'ni'=>'NOT LIKE', //is not in
                'ew'=>'LIKE', //ends with
                'en'=>'NOT LIKE', //doesn't end with
                'cn'=>'LIKE', // contains
                'nc'=>'NOT LIKE'  //doesn't contain
        );
        function getWhereClause($col, $oper, $val){
                global $ops;
                if($oper == 'bw' || $oper == 'bn') $val .= '%';
                if($oper == 'ew' || $oper == 'en' ) $val = '%'.$val;
                if($oper == 'cn' || $oper == 'nc' || $oper == 'in' || $oper == 'ni') $val = '%'.$val.'%';
                return " WHERE $col {$ops[$oper]} '$val' ";
        }
        $where = ""; //if there is no search request sent by jqgrid, $where should be empty
        $searchField = isset($_POST['searchField']) ? $_POST['searchField'] : false;
        $searchOper = isset($_POST['searchOper']) ? $_POST['searchOper']: false;
        $searchString = isset($_POST['searchString']) ? $_POST['searchString'] : false;

/**************************/


        if(!$sidx) 
            $sidx =1;
        $count = $this->db->count_all_results('info'); 
        if( $count > 0 ) {
            $total_pages = ceil($count/$limit);    
        } else {
            $total_pages = 0;
        }

        if ($page > $total_pages) 
            $page=$total_pages;

        $query = $this->JqgridSample->getAllData($start,$limit,$sidx,$sord,$where); 
        $responce->page = $page;
        $responce->total = $total_pages;
        $responce->records = $count;
        $i=0;
        foreach($query as $row) {
            $responce->rows[$i]['id']=$row->id;
            $responce->rows[$i]['cell']=array($row->name,$row->email,$row->passport,$row->phone,$row->fax,$row->address);
            $i++;
        }

        //return json_encode($responce);
       echo json_encode($responce);
    }

以下是该模型的代码：

function getAllData($start,$limit,$sidx,$sord,$where){

   $this->db->select('id,name,email,passport,phone,fax,address');
    $this->db->limit($limit);
     if($where != NULL)
          $this->db->where($where,NULL,FALSE);
       $this->db->order_by($sidx,$sord);
       $query = $this->db->get('info',$limit,$start);
       return $query->result();
}

以下是视图的代码：

<body>
 <center>
    <h1>Codeigniter With JQGrid</h1>
<table id="list"></table><!--Grid table-->
<div id="pager"></div>  <!--pagination div-->
</center>
</body>

<script type="text/javascript">
    $(document).ready(function (){
        jQuery("#list").jqGrid({
            url: 'http://localhost/ProyectoNetbeans/CodeIgniter_2.1.3/index.php/Nacionalidades_controller/loadData',
            mtype : "post",             //Ajax request type. It also could be GET
            datatype: "json",            //supported formats XML, JSON or Arrray
            colNames:['Name','Email','Passport','Phone','Fax','Address'],       //Grid column headings
            colModel:[
                {name:'name',index:'name', width:100, align:"left"},
                {name:'email',index:'email', width:150, align:"left"},
                {name:'passport',index:'passport', width:100, align:"right"},
                {name:'phone',index:'phone', width:100, align:"right"},
                {name:'fax',index:'fax', width:100, align:"right"},
                {name:'address',index:'address', width:100, align:"right"}
            ],
            rowNum:10,
            width: 750,
            //height: 300,
            rowList:[10,20,30],
            pager: '#pager',
            sortname: 'id',
            viewrecords: true,
            rownumbers: true,
            gridview: true,
            caption:"List Of Person"
        }).navGrid('#pager',{edit:false,add:false,del:false});
    });
</script>

有人知道如何解决这个问题吗？

Answer 1

在我看来，您应该设置服务器响应的Content-Type标头，而不仅仅是将JSON数据放在响应的主体中。可以使用

$this->output->set_header('Content-Type: application/json; charset=utf-8');

例如，这样做。可能更好的事情是使用

$this->output->set_content_type('application/json')
             ->set_output(json_encode($re‌sponce));

我不是CodeIgniter开发人员，但CodeIgniter的the documentation中的外观似乎是您遇到问题的原因。

Jqgrid没有使用codeigniter显示json数据

1 个答案: