c# - 如何防止 Syncfusion ASP.Net Webforms Grid 中的过滤器文本框发送服务器端请求？

Question

我在 ASP.Net Webforms 4.0 网站中使用来自 Syncfusion 的最新版本的 WebForms Grid。绑定(bind)是使用 WebMethod 完成的，即支持 ajax 的 Web 服务。该网格的标记如下。

问题是当我在 Product Name 列上过滤并开始输入 Product Name 的过滤框时，网格会向服务器发送匹配产品的请求键入的每个字符的名称。我不希望这样，用户可以在过滤器文本框中键入内容，而无需任何服务器端请求减慢用户的键入速度。

问题:如何防止Product Name 的过滤器文本框在用户向文本框输入内容时发送服务器请求？我尝试在他们的文档中搜索一些网格属性来解决这个问题，但找不到。

来自 Syncfusion 的 Webforms 网格标记

<ej:Grid ID="Grid1" runat="server" AllowFiltering="True" AllowPaging="True" AllowSorting="True" >
    <DataManager Adaptor="WebMethodAdaptor" URL="WebService1.asmx/GetProducts"   />
    <Columns>
        <ej:Column Field="ProductId"  Width="200" HeaderText="Product ID" AllowFiltering="true"></ej:Column>
        <ej:Column Field="ProductName" Width="200" HeaderText="Product Name" AllowFiltering="true"  ></ej:Column>
        <ej:Column Field="UnitPrice" Width="200" HeaderText="Unit Price" Format="{0:c}" AllowFiltering="true"></ej:Column>
        <ej:Column Field="UnitsInStock"  Width="200" HeaderText="Units in Stock" AllowFiltering="true"></ej:Column>
    </Columns>
    <PageSettings Template=""></PageSettings>
    <RowDropSettings DropTargetID="" DropMapper=""></RowDropSettings>
    <ScrollSettings EnableTouchScroll="False"></ScrollSettings>
    <FilterSettings FilterType="Menu" EnableCaseSensitivity="false"></FilterSettings>
</ej:Grid>

Answer 1

我们已经分析了您的查询，并通过使用 grid 的 DataBound 事件和 ejDataManger 实现了您的要求。因为我们已经将代码后面的全部数据绑定(bind)到 ejDataManager 并将其分配给 ejAutocomplete 的 dataSource 属性。现在，当我们关注自动完成时，我们已经将数据绑定(bind)到自动完成数据源，如果我们选择任何数据，它将阻止 POST。由于整个数据已作为本地数据检索。

请引用下面的代码示例，

[Default.aspx]

  <ej:Grid ID="Grid1" runat="server" AllowFiltering="True"  AllowPaging="True"…

   <ClientSideEvents DataBound="databound"/>

   …

     <script type="text/javascript">
     var b;
    function databound(args) {
         setTimeout(function () {
            var dataManager = ej.DataManager({ url: "WebService1.asmx/HelloWorld", offline: true, adaptor: "UrlAdaptor" });
            var promise = dataManager.executeQuery(new ej.Query());
            promise.done(function (e) {
            var a = 
   $("#MainContent_Grid1_acString").ejAutocomplete("instance");
                b = e.result;

            });
         promise.fail(function (s) {
                  console.log(s)
    })
  $("#MainContent_Grid1_acString").ejAutocomplete({ focusIn: "change" });
        }, 600);
    }
        function change(args) {
            var a =          $("#MainContent_Grid1_acString").ejAutocomplete("instance");
            a.model.dataSource = b;          //Passed the data as local when we focusIn the autocomplete
        }
</script>

[WebService1.asmx.cs]

 [WebMethod]

      public IEnumerable HelloWorld()

    {

        SqlConnection myConnection = new SqlConnection(ConfigurationManager.ConnectionStrings["NORTHWNDConnectionString"].ToString());
        …

        IEnumerable order = (from DataRow row in dt.Rows
                             select new Products
                             {
                                 ProductId = Convert.ToInt32(row["ProductId"]),
                                 ProductName = row["ProductName"].ToString(),
                                 UnitPrice = Convert.ToDouble(row["UnitPrice"]),
                                 UnitsInStock = Convert.ToInt32(row["UnitsInStock"])
                             }).ToList();


        return order;
    }

在上面的代码中，我们在代码隐藏中初始化了一个方法，并单独返回结果以将数据绑定(bind)到自动完成。