0

我有一个在页面加载时填充的数据表。我正在使用该数据表上的 foreach 在客户端填充我的表。现在用户将输入一些搜索条件,我想再次获取数据并重新显示结果。

我想避免使用更新面板。
因此,我在后面的代码中创建了一个静态方法,以便在接受从 ajax 调用传入的参数时从数据库中进行必要的检索。我在我的 javascript 中创建了我的 ajax 调用并传入了我的数据。

ajax 使用正确的数据进行调用,然后从数据库中检索我的数据。我的 dataTable 值已设置。现在我不太清楚如何用新数据更新我的表。

就好像我需要重新触发我的 html 代码的 foreach 部分一样。

有任何想法吗?


我的javascript函数

$('#btnRunSearch').click(function () {
            $.ajax({
                type: "POST",
                url: "Home.aspx/GetInspectionData",
                data: "{'insp':'00000000-0000-0000-0000-000000000000', 
                       'searchVal':'', 
                       'startDate':'2013-03-01', 
                       'endDate':'2013-04-01', 
                       'agent':'', 
                       'status':0, 'sortexp':''}",
                contentType: "application/json;charset=utf-8",
                dataType: "json",
                success: function (msg) {




                }
            });

        });

我的 HTML

<tbody>
   <%
      foreach (System.Data.DataRow dr in dtInspections.Rows)
      {
    %>
      <tr>
        <td>

服务器端代码

[WebMethod]
    public static bool GetInspectionData(string insp, 
               string searchVal, string startDate, string endDate, 
               string agent, int status, string sortexp)
    {

        // this.SetFiltersToSession();

        int intCurrentCompany = login.GetCurrentlyLoggedInInspectorCompany();


        Guid inspector = new Guid(insp);
        DataSet ds = Bizlogic.cBizLogicBaseClass.GetGenDataAccess().
           GetDataSet("usp_Get_SearchInspections", "Inspections", 
           true, 
           intCurrentCompany, 
           inspector, 
           searchVal, 
           startDate, 
           endDate, 
           agent, 
           status, 
           sortexp);

         //dtInspections is the dataTable that is used to populate the table
        dtInspections = ds.Tables[0];



        return true;


    }
4

2 回答 2

1

最简单的方法是将表格的 html 放在与其他所有内容不同的视图中,然后使用 jQuery .load 函数。这将允许您的 ajax 调用在每次调用时将表加载到 div 中。

您可以在此处找到加载函数的文档。

html:

<div id="container"></div>

Javascript:

$('#container').load("Home.aspx/GetInspectionData", 
                     "{'insp':'00000000-0000-0000-0000-000000000000', 
                     'searchVal':'', 
                     'startDate':'2013-03-01', 
                     'endDate':'2013-04-01', 
                     'agent':'', 
                     'status':0, 'sortexp':''}",
                     function() {
    //
    //code for complete function goes here
    //
});

如果我解释得不够好或者您有更多问题,请告诉我。

于 2013-07-09T17:20:20.033 回答
0

通过 ajax 调用更改服务器端变量不会自动更新 UI。ajax 的重点是在不重新加载页面的情况下访问服务器。这是使 UpdatePanel 变得更好的部分原因 - 您可以进行服务器端更新,它会为您处理更新 UI。

如果您想在没有更新面板的情况下使用 ajax,则需要您的 WebMethod 来返回数据,然后使用 javascript 重新填充表。

于 2013-07-09T18:06:53.390 回答