Navgrid不在JQGrid上显示添加/删除

时间:2015-03-23 19:16:40

标签: javascript jquery jqgrid

请找我附上的代码:

Jqgrid创作:

<script type="text/javascript">

         $(function () {
             $("#datagrid").jqGrid({
                 url: 'jqgridwithwebmethod.aspx/ConvertDataTabletoString',
                 datatype: 'json',
                 mtype: 'POST',

                 serializeGridData: function (postData) {

                     // return JSON.stringify(postData);
                     return JSON.stringify(postData);
                 },

                 ajaxGridOptions: { contentType: "application/json" },
                 loadonce: true,
                 colNames: ['Name', 'Age', 'Mobile', 'City', 'Sex', 'FirstName', 'LatName', 'Address', 'Landline'],
                 colModel: [
         { name: 'Name', index: 'Name', width: 200, frozen: true, editable: true },
         { name: 'Age', index: 'Age', sorttype: 'int', width: 200, editable: true },
         { name: 'Mobile', index: 'Mobile', sorttype: 'int', width: 200, editable: true },
         { name: 'City', index: 'City', width: 200, editable: true },
         { name: 'Sex', index: 'Sex', width: 200, editable: true },
         { name: 'FirstName', index: 'FirstName', width: 200, editable: true },
         { name: 'LastName', index: 'LastName', width: 200, editable: true },
         { name: 'Address', index: 'Address', width: 200, editable: true },
         { name: 'Landline', index: 'Landline', width: 300, editable: true }

                 ],
                 pager: '#nav',
                 rowNum: 10,
                 sortname: 'Name',
                 autowidth: true,
                 sortorder: "desc",
                 shrinkToFit: false,
                 //forceFit:false,
                 loadonce: true,
                 rowList: [10, 20, 30],
                 viewrecords: true,
                 gridview: true,
                 jsonReader: {
                     page: function (obj) { return 1; },
                     total: function (obj) { return 1; },
                     records: function (obj) { return obj.d.length; },
                     root: function (obj) { return obj.d; },
                     repeatitems: false
                     //id: "0"
                 },
                 caption: 'My first grid'
             });                 
             $("#datagrid").jqGrid('setFrozenColumns');
         });
         **$('#datagrid').jqGrid('navGrid', '#nav',**
                  {
                      edit: true,
                      add: true,
                      del: true,
                      search: true,
                      searchtext: "Search",
                      addtext: "Add",
                      edittext: "Edit",
                      deltext: "Delete"
                  });
                  </script>

ConvertDataTabletoString函数定义为:

 [WebMethod]
    public static List<Dictionary<string, object>> ConvertDataTabletoString()
    {
        DataTable dt = new DataTable();
        using (SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["conn"].ConnectionString))
        {
            using (SqlCommand cmd = new SqlCommand("select *  from studen with(nolock)", con))
            {
                con.Open();
                SqlDataAdapter da = new SqlDataAdapter(cmd);
                da.Fill(dt);
                System.Web.Script.Serialization.JavaScriptSerializer serializer = new System.Web.Script.Serialization.JavaScriptSerializer();
                List<Dictionary<string, object>> rows = new List<Dictionary<string, object>>();
                Dictionary<string, object> row;
                foreach (DataRow dr in dt.Rows)
                {
                    row = new Dictionary<string, object>();
                    foreach (DataColumn col in dt.Columns)
                    {
                        row.Add(col.ColumnName, dr[col]);
                    }
                    rows.Add(row);
                }

                return rows;

            }
        }
    }     

Jqgrid使用从SQL Server收到的数据。 编辑/添加/删除图标在Jqgrid上没有显示..

请帮助......

1 个答案:

答案 0 :(得分:0)

您将navGrid方法的调用放在了错误的地方。您有阻止$(function () {...});块的文件就绪事件处理程序。您已将navGrid方法的调用从块中调出。这是不对的。你应该在上面一行模式(直接在调用setFrozenColumns之后)来修复问题。