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

Question

我有一个包含很多行的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＃中的代码背后？

Answer 1

您的问题尽管很简单，但是如果您在我提供了将数据发送到背后的代码之后不进行重新思考和重新评估的话，可能会导致体系结构或意大利面条的后果。 您将使用Ajax，这将允许您构建模型或对象以发送到后面的代码。

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

     return content;
}

为了简洁起见，没有任何应该执行的null检查。 这将为我们建立一个简单的对象以传递回去。

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

这两行非常简单，我们构建一个Array并开始填充它。 显然，我们会将其包裹在一个循环中，以确保它使用相关的Grid 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 。 实际上，Microsoft推荐Newtonsoft.Net ，但我将向您展示Microsoft。

在反序列化之前，我们需要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 Page生命周期作战。 希望这对您有所帮助。

Answer 2

你可以通过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");
    }
});

Answer 3

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

让我们看一下这种方法： ASP.NET-将UpdatePanel触发器添加到gridview内的LinkBut​​ton上

您可以像下面这样使用CommandName和CommandArgument（在您的情况下为row-id）： Repeater内的复选框，如何在选中更改的函数中获取命令名称值