Question

我正在尝试从我的SQL数据库中提取数据并将其显示在Jquery DataTable中。我能够使用Gridview执行此操作，但现在想要更改为Jquery DataTable以获得更多功能。看起来数据是在我的BindGrid（）函数中收集的，但它实际上不会显示在网页上的表格中，标题显示但它们下方没有信息。

以下是我的网络表单的图片：

此外，这是我现在的所有代码：

HTML：

<div style="margin-top:30px;">
        <table class="table table-striped table-bordered" style="font-family: serif; border:1px;" id="netEventTable" clientIdMode="static">
            <thead>
                <tr>
                    <th>ID</th> 
                    <th>Username</th>
                    <th>Type</th>
                    <th>Subject Line</th>
                    <th>Start Time</th>
                    <th>Estimated Time of Resolution</th>
                </tr>
            </thead>
            <tbody id="netEventTableBody" runat="server">

            </tbody>
        </table>
    </div>

JQUERY：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js" type="text/javascript"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.0/jquery-ui.min.js" type="text/javascript"></script>
<script src="https://cdn.datatables.net/1.10.10/js/jquery.dataTables.min.js" type="text/javascript"></script>
<link href="" rel="stylesheet" />
<script type="text/javascript">
    $(document).ready(function () {
        $('#netEventTable').dataTable({
            "bLengthChange": true,
            "paging": true,
            "sPaginationType": "full_numbers",
            "jQueryUI": true,               
        });
    });
</script>

C＃（CodeBehind）：

 protected void Page_Load(object sender, EventArgs e)
    {
        if (!this.IsPostBack)
        {
            this.BindGrid();
        }
    }

    private void BindGrid()
    {
        string strSQLConn = ConfigurationManager.ConnectionStrings["DatabaseConnectionString"].ConnectionString;
        try
        {
            // Jquery DataTable
            SqlConnection con = new SqlConnection(strSQLConn);
            con.Open();
            SqlCommand cmd = new SqlCommand("getNetEvents", con);
            SqlDataReader user = cmd.ExecuteReader();
            String UnreadText = "";
            Int32 i = 0;
            while (user.Read())
            {
                UnreadText += "<tr>";
                UnreadText += "<td class=\'center'>" + user["ID"] + "</td>";
                UnreadText += "<td class=\'center'>" + user["Name"] + "</td>";
                UnreadText += "<td class=\'center'>" + user["Type"] + "</td>";
                UnreadText += "<td class=\'center'>" + user["SubjectLine"] + "</td>";
                UnreadText += "<td class=\'center'>" + user["StartTime"] + "</td>";
                UnreadText += "<td class=\'center'>" + user["EndTime"] + "</td>";
                UnreadText += "</tr>";
                i++;
            }
            con.Close();


        }
        catch (Exception ex)
        {
            Console.WriteLine("ERROR: " + ex.ToString());
            Helpers.ApplicationLogHelper.createApplicationLogError("ERROR", ex.ToString());
            return;
        }
    }

如何从SQL服务器获取数据以显示在Jquery DataTable中？

Answer 1

我认为你错过了这部分，

"ajax": {
        url: 'some url',
        type: "GET",
        error: function (data) {
            //catch error
        }
    }

因为你只是初始化jquery数据表所以它根本不会做任何事情。

Jquery表主体不显示SQL数据

1 个答案: