Question

我希望将5页显示为“第1页，共5页”“查看1 - 5 of 25”，启用下一个，上一个和第一个，最后一个按钮。（我的数据库中共有25条记录）
例如.. enter image description here

它向我展示了

第1页，共1页第1-5页，共5页

我使用的Web方法如下：

`public JQGrid GetDataForGrid（int pageIndex，int pageSize，string sortIndex，string sortDirection，bool _search，string filters） { JQGrid l_oJQGrid = null;

        try
        {
            using (SqlConnection l_oConn = new SqlConnection(WebConfigurationManager.ConnectionStrings[APP_CONNSTR].ConnectionString))
            {
                l_oConn.Open();

                using (SqlDataAdapter l_oDA = new SqlDataAdapter("GetMasterListData", l_oConn))
                {
                    l_oDA.SelectCommand.CommandType = CommandType.StoredProcedure;
                    l_oDA.SelectCommand.Parameters.AddWithValue("@p_intPage", pageIndex);
                    l_oDA.SelectCommand.Parameters.AddWithValue("@p_intRows", pageSize);
                    l_oDA.SelectCommand.Parameters.Add("@p_intTotalRows", SqlDbType.Int);
                    l_oDA.SelectCommand.Parameters["@p_intTotalRows"].Direction = ParameterDirection.Output;

                    using (DataSet l_oDS = new DataSet())
                    {
                        l_oDA.Fill(l_oDS);
                        if (!l_oDS.HasErrors)
                        {
                            using (DataTable l_oDT = l_oDS.Tables[0])
                            {
                                DataRow[] l_oRows = null;
                                int l_iColCount = l_oDT.Columns.Count;
                                int l_iIDColIndex = l_oDT.Columns.IndexOf("Id");

                                if (!string.IsNullOrEmpty(sortIndex))
                                    l_oRows = l_oDT.Select(string.Empty, sortIndex + " " + sortDirection);
                                else
                                    l_oRows = l_oDT.Select();

                                l_oJQGrid = new JQGrid();

                                if (_search && !String.IsNullOrEmpty(filters))
                                {
                                    JavaScriptSerializer serializer = new JavaScriptSerializer();
                                    JQGrid.JQGridSearchFilter searchFilter = serializer.Deserialize<JQGrid.JQGridSearchFilter>(filters);
                                    // use the searchFilter here
                                }

                                foreach (DataRow l_oRow in l_oRows)
                                {
                                    JQGrid.Row l_oJQRow = new JQGrid.Row();
                                    l_oJQRow.id = l_oRow["Id"].ToString();
                                    for (int l_iColCtr = 0; l_iColCtr < l_iColCount; l_iColCtr++)
                                    {
                                        if (l_iColCtr != l_iIDColIndex)
                                            l_oJQRow.cell.Add(l_oRow[l_iColCtr].ToString());
                                    }

                                    l_oJQGrid.rows.Add(l_oJQRow);
                                }

                                int l_iRecCount = Convert.ToInt32(l_oDA.SelectCommand.Parameters["@p_intTotalRows"].Value);

                                l_oJQGrid.page = pageIndex;
                                l_oJQGrid.records = l_iRecCount;
                                l_oJQGrid.total = (l_iRecCount + pageSize - 1) / pageSize;
                            }
                        }
                    }
                }
            }
        }
        catch (Exception ex)
        {
            throw ex;
        }

        return l_oJQGrid;
    }

我的jqgrid代码就像这样

$(document).ready(function () {
var oItemGrid = $("#ItemGrid");

oItemGrid.jqGrid({
    datatype: function (jqGridParams) {
        getData(jqGridParams);
    },
    colNames: ['Type', 'Name', 'Desc'],
    colModel: [
        { name: 'Type', index: 'Type', width: 40 },
        { name: 'Name', index: 'Name', width: 40 },
        { name: 'Desc', index: 'Desc', width: 40 }
    ],
    autowidth: true,
    height: 'auto',
    rowNum: 5,
    rowList: [5, 10, 15, 20, 25],
    viewrecords: true,
    gridview: true,
    autoencode: true,
    ignoreCase: true,
    caption: 'Filter and Search Functionality',
    pager: '#IGPager',
    loadonce: true
}).jqGrid('navGrid', '#IGPager', { edit: true, add: true, del: true}, {}, {}, {}, {}, {});
});`

我需要做什么才能启用网格寻呼机上的下一个，上一个，第一个，最后一个按钮???

Answer 1

我认为你的jquery代码很好。但是你的后端脚本发送的数据发送没有分页，看起来它正在选择表中的所有行。

例如，看看jqgrid + codeigniter示例 ..........................你的控制器动作........... $ limit = 10;

    $search = $this->input->post('_search');
    $nd = $this->input->post('nd');
    $page = $this->input->post('page');
    $limit = $this->input->post('rows');
    $sidx = $this->input->post('sidx');
    $sord = $this->input->post('sord');
    $where = 'where 1 ';

    if($this->acl->uid() != 1)
        $where .= "AND id != 1 ";

    if($search != 'false'){
      $data = json_decode($this->input->post('filters'));
      foreach($data->rules as $rule){
          $where .= "AND ". $rule->field . " like '" . $rule->data. "%' ";
      }
    }

    if(!$sidx) $sidx =1;

    $count = $this->model->count($where); // get the total records

    if( $count > 0 ) { $total_pages = ceil($count/$limit); } else { $total_pages = 0; }

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

    $start = $limit * $page - $limit;


    $users = $this->model->limitUsers($sidx,$sord,$start,$limit,$where);

    $responce->page = $page; 
    $responce->total = $total_pages; 
    $responce->records = $count;
    $i = 0;
    $base = base_url();       
    if($users){
      foreach($users as $row){
        $edit = $base.'user/edit/'.$row['id'];
        $responce->rows[$i]['id']=$row['id']; 
        $role = $this->group->getAttrbute($row['user_group'],'name');
        $status = ($row['status']) ? "Active":"Disabled";
        $responce->rows[$i]['cell'] = array(
                $responce->rows[$i]['id'] = $row['id'],
                $responce->rows[$i]['username'] = $row['username'],
                $responce->rows[$i]['first_name'] = $row['first_name'],
                $responce->rows[$i]['last_name']=$row['last_name'],
                $responce->rows[$i]['email']=$row['email'],
                $responce->rows[$i]['user_group']=$this->grade->getName($row['grade']),
                $responce->rows[$i]['date_created']=$row['date_created'],
                $responce->rows[$i]['password']=$row['password'],
                $responce->rows[$i]['status']=$status,
                $responce->rows[$i]['action'] = '<a title="Edit" class="editthisrecord" href="'.$edit.'">Edit</a> <a title="Delete" class="deletethisrecord" href="#">Delete</a>'
        );
      $i++;
      }
    }
    echo json_encode($responce);

.................. 希望这会有所帮助

如何在jqgrid中允许寻呼机的下一个，上一个和第一个，最后一个按钮

1 个答案: