2013-04-07 150 views
0

我試圖用codeigniter實現jqGrid。我設置了一切,看起來是正確的,網格顯示,但沒有加載任何信息。該構造JSON結構打印以下,所述控制器:Jqgrid不顯示json數據與codeigniter

{"page":1,"total":1,"records":2,"rows":[{"id":"132","cell":["user1","[email protected]","1123","22767830","22767830","address"]},{"id":"12222","cell":["user2","[email protected]","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> 

有人知道如何解決這個問題?

+0

將代碼發佈到您的網格,我們可以看看你在做什麼。 – Mark 2013-04-07 02:37:33

+0

感謝您的建議,我只是通過評論和代碼糾正了帖子。 – Vito 2013-04-07 02:55:03

+0

網格是否實際調用了你的loadData控制器函數?你能看到從jqGrid和Firebug中返回的數據發出的呼叫嗎? – Mark 2013-04-07 03:02:56

回答

0

在我看來,你應該設置服務器響應的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)); 

我不是笨開發者,但在笨的the documentation外觀似乎是你的問題的原因。

+0

非常感謝Oleg!解決了這個問題,因爲它消除了響應中的HTML代碼,只留下了JSON代碼。感謝Mark對他的幫助。 – Vito 2013-04-07 18:18:33

+0

@Vito:不客氣! – Oleg 2013-04-07 18:33:03