如何跟踪ASP.NET中的复选框更改

本文关键字：复选框 NET ASP 何跟踪 跟踪 | 更新日期: 2023-09-27 18:10:01

我有一个包含许多行的Gridview，每行都有两个复选框，一个用于美国可用性，另一个用于英国可用性。之前，代码使其在每次更改复选框时，页面都会进行回发，并运行用于更新该项的代码。可以想象，对于数百行，任何重大更改都需要很长时间，并且通过这种方法会变得非常乏味。

因此，我为复选框上的更改创建了一些jQuery侦听器，这些方法本质上是根据自创建页面以来对该复选框所做的更改，将单击的复选框的索引添加到现有的Javascript数组中。

$('.checkUs input:checkbox').click(function () {
    var row = $(this).parent().parent().parent().index();
    var isChecked = $(this).is(':checked');
    if (isChecked && $.inArray(row, usRowsChecked) === -1 && $.inArray(row, usRowsUnchecked) === -1)
      usRowsChecked.push(row);
    else if (isChecked && $.inArray(row, usRowsUnchecked) !== -1)
      usRowsUnchecked.splice($.inArray(row, usRowsUnchecked), 1);
    if (!isChecked && $.inArray(row, usRowsUnchecked) === -1 && $.inArray(row, usRowsChecked) === -1)
      usRowsUnchecked.push(row);
    else if (!isChecked && $.inArray(row, usRowsChecked) !== -1)
      usRowsChecked.splice($.inArray(row, usRowsChecked), 1);
  });

现在我不知道如何将这些信息返回到服务器以运行SQL查询，经过一点研究，我不太确定这是最好的解决方案。

当用户点击"保存"按钮时，我需要向后端发送四个阵列：

var usRowsChecked = [];
var usRowsUnchecked = [];
var ukRowsChecked = [];
var ukRowsUnchecked = [];

我如何将这些信息传达给C#中的代码？

如何跟踪ASP.NET中的复选框更改

在我提供了将数据发送到代码背后的方法后，如果你不重新思考和评估，你的问题虽然很简单，但可能会产生一些架构或意大利面条式的后果。您将使用Ajax，这将允许您构建一个模型或对象以发送到代码背后。

function BuildModel (Id, Country) {
     var content = {
          Id : Id,
          Country : Country
     };
     return content;
}

为了简洁起见，不需要进行任何null检查。这将为我们构建一个简单的对象以传递回去。

var content = new Array();
content.Push(BuildModel($('.Id'), $('.Country));

这两行非常简单，我们构建一个数组并开始填充它。显然，我们会将其封装在一个循环中，以确保它捕获具有相关网格Id的所有元素。

现在我们将构建我们的Ajax：

var jsonObject = JSON.stringify(content);
$.ajax({
     url: '<%= Page.ResolveURL("~/SomePage.aspx") %>',
     data: { Model : jsonObject },
     type: 'POST'
     success: function () {
         // Do something with returned data.
     }
});

然后在代码背后，您可以使用内置的.Net JavaScript.Serializer或Newtonsoft.Net。微软实际上推荐Newtonsoft.Net而不是他们的，但我会给你看微软的。

在反序列化之前，我们需要Model。

public class Example
{
     public int Id { get; set; }
     public bool Country { get; set; }
}

我们有自己的模型，所以当我们反序列化时，我们会执行以下操作：

var model = new Example();
var serializer = new JavaScriptSerializer();
List<Example> deserialize = serializer.Deserialize<List<Example>>(Request["Model"]);

现在你有了一个可行的所有数据的集合。

不过，上面的方法并不是唯一的方法，如果您的应用程序保证PostBacks，那么您可以使用构建的控件UpdatePanel或runat="server"在代码背后从前端获取元素。

你有几个选择，但正确的选择会因你的申请而异。每个都有优点和缺点，但无论哪种方式，你都要与Asp.Net页面生命周期作斗争。希望这对你有所帮助。

为什么不将网格插入UpdatePanel并使用Commands？

看看这种方法：ASP.NET-在gridview 中向LinkButton添加UpdatePanel触发器

您可以像这样使用CommandName和CommandArgument(在您的情况下为行id(：中继器内部的复选框，如何在检查更改的函数中获得命令名称值

您可以通过ajax来完成：

在aspx.cs文件中添加WebMethod:

    [WebMethod]
    public static int SaveArray(int[] usRowsChecked,int[] usRowsUnchecked, int[]ukRowsChecked, int[] ukRowsUnchecked )
    {
        //do here whatever you want with values
    }

在aspx文件(javascript(中添加如下方法：

$.ajax({
    type: 'POST',
    data: "{usRowsChecked:" + usRowsChecked + 
    ", usRowsUnchecked :" + usRowsUnchecked +
    ", ukRowsChecked :" + ukRowsChecked +
    ", ukRowsUnchecked :" + ukRowsUnchecked +"}",
    contentType: 'application/json; charset=utf-8',
    dataType: 'json',
    async: true,
    url: "YourPage.aspx/SaveArray",
    success: function (result) {
        alert("success");
    },
    error: function (msg) {
        alert("error");
    }
});
相关文章：