asp.net中的JQGrid不显示数据(不可见)

时间:2015-02-11 22:26:34

标签: c# jqgrid-asp.net

我正在关注this示例,我很难在gridview中显示数据。加载页面后,它将转到GetData并返回值。

如果在我填充数据表后立即在窗口中看到计数?dtResult.Rows.Count,我得到1001。所以我知道我有数据。 但是,当我调试应用程序时,我只得到三个按钮。我在这里错过了什么?

以下是aspx代码:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="test.aspx.cs" Inherits="TestApp.test" %>
<%@ Register Assembly="Trirand.Web" TagPrefix="trirand" Namespace="Trirand.Web.UI.WebControls" %>
<!DOCTYPE html>
<html lang="en-us">
<head id="Head1" runat="server">
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" media="screen" href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.10.3/themes/redmond/jquery-ui.css" />
<!-- The jQuery UI theme extension jqGrid needs -->
<link rel="stylesheet" type="text/css" media="screen" href="/themes/ui.jqgrid.css" />
<!-- jQuery runtime minified -->
<script src="http://ajax.microsoft.com/ajax/jquery/jquery-2.0.3.min.js" type="text/javascript"></script>
<!-- The localization file we need, English in this case -->
<script src="/js/trirand/i18n/grid.locale-en.js" type="text/javascript"></script>
<!-- The jqGrid client-side javascript -->
<script src="/js/trirand/jquery.jqGrid.min.js" type="text/javascript"></script>    

<style type="text/css">
    body, html { font-size: 80%; }    
</style>
</head>
<body>
<form id="form1" runat="server">
<div>       
   <div id="message">

   <script type="text/javascript">

       function addRow() {
           var grid = jQuery("#<%= JQGrid1.ClientID %>");
           grid.editGridRow("new", grid.addDialogOptions);
       }

       function editRow() {
           var grid = jQuery("#<%= JQGrid1.ClientID %>");
           var rowKey = grid.getGridParam("selrow");
           var editOptions = grid.getGridParam('editDialogOptions');
           if (rowKey) {
               grid.editGridRow(rowKey, editOptions);
           }
           else {
               alert("No rows are selected");
           }
       }

       function delRow() {
           var grid = jQuery("#<%= JQGrid1.ClientID %>");
           var rowKey = grid.getGridParam("selrow");
           if (rowKey) {
               grid.delGridRow(rowKey, grid.delDialogOptions);
           }
           else {
               alert("No rows are selected");
           }
       }
   </script>

   <input type="button" onclick="addRow()" value="Add" />
   <input type="button" onclick="editRow()" value="Edit" />
   <input type="button" onclick="delRow()" value="Delete" />

    <trirand:jqgrid runat="server" ID="JQGrid1"
        OnRowDeleting="JQGrid1_RowDeleting"
        OnRowAdding="JQGrid1_RowAdding"
        OnRowEditing="JQGrid1_RowEditing">         
        <Columns>
            <trirand:JQGridColumn DataField="Addressbookid" Editable="false" PrimaryKey="true" />
            <trirand:JQGridColumn DataField="ClientName" Editable="true" />
            <trirand:JQGridColumn DataField="Clientno" Editable="true" />
            <trirand:JQGridColumn DataField="IndustryName" Editable="true" />             
        </Columns>
        <ToolBarSettings ShowEditButton="true" ShowAddButton="true" ShowDeleteButton="true" />
        <EditDialogSettings CloseAfterEditing="true" Caption="The Edit Dialog"  />
        <AddDialogSettings CloseAfterAdding="true" />              

    </trirand:jqgrid>

   </div>
   <br /><br />


</div>
</form>

这是代码隐藏:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data.SqlClient;
using System.Data;
using System.Configuration;

namespace TestApp
{
public partial class test : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        JQGrid1.DataSource = GetData();
        JQGrid1.DataBind();
    }


    protected DataTable GetData()
    {
        if (Session["EditDialogData"] == null)
        {
            // Create a new Sql Connection and set connection string accordingly
            SqlConnection sqlConnection = new SqlConnection();
            sqlConnection.ConnectionString = ConfigurationManager.ConnectionStrings["Sandbox"].ConnectionString;
            sqlConnection.Open();

            string sqlStatement = "Select * from voiceportal.dbo.clients_v";

            // Create a SqlDataAdapter to get the results as DataTable
            SqlDataAdapter sqlDataAdapter = new SqlDataAdapter(sqlStatement, sqlConnection);

            // Create a new DataTable
            DataTable dtResult = new DataTable();

            // Fill the DataTable with the result of the SQL statement
            sqlDataAdapter.Fill(dtResult);

            Session["EditDialogData"] = dtResult;

            return dtResult;
        }
        else
        {
            return Session["EditDialogData"] as DataTable;
        }
    }
}

}

有关如何解决此问题的任何建议?

由于

1 个答案:

答案 0 :(得分:1)

我的两分钱。

  1. 确保网格区域设置js文件位于正确的位置,并且很好地提供给您的浏览器。查看相关行: <script src="/js/trirand/i18n/grid.locale-en.js" type="text/javascript"></script> 使用F12打开您的开发人员控制台,刷新页面并在控制台上查找下载的文件和错误消息,以确定这是否顺利。

  2. 仔细检查您提供的数据是否与列配置匹配。特别注意骆驼套管。 .NET属性以大写字母开头,它们是驼峰式的,但JSON数据通常以小写字母开头。这还取决于你是否使用任何转换(如NewtonSoft和东西)。我不知道您voiceportal.dbo.clients_v表格中的内容,请指明您的架构。在您的ASPX代码中,AddressbookidClientno不是骆驼。它们不应该是AddressbookIdClientNo吗?取决于您的架构以及通过电汇实际传达的内容。