使用jQuery将JavaScript数组传递给服务器端函数

本文关键字：服务器端 函数 数组 jQuery JavaScript 使用 | 更新日期: 2023-09-27 18:26:15

我想执行以下步骤：

  1. 取一个复选框值的列表，并将它们放入JavaScript中的字符串数组中
  2. 获取数组并将其发送到服务器端函数
  3. 将阵列服务器端放入DataTable中
  4. 获取DataTable并将其作为TVP发送到存储过程

我已经在服务器端实现了这一点。我遇到的问题是从JavaScript到服务器。

用我当前的代码，我得到这个错误：

结构化类型中没有足够的字段。结构化类型必须至少有一个字段。

如何将JavaScript数组传递给web方法？

<asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" />
<asp:GridView ID="GridView1" runat="server">
</asp:GridView>
</form>


using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Configuration;
using System.Data.SqlClient;
using System.Data;
using System.Web.Script.Services;
using System.Web.Services;

    namespace SendTVP
    {
        public partial class _default : System.Web.UI.Page
        {
            //page variables
            string filterList = string.Empty;
            DataTable dt = new DataTable();
            protected void Page_Load(object sender, EventArgs e)
            {
            }
            protected void Button1_Click(object sender, EventArgs e)
            {
                string cs = ConfigurationManager.ConnectionStrings["dbcs"].ConnectionString;
                using (var con = new SqlConnection(cs))
                {
                    using (var cmd = new SqlCommand("spFilterPatientsByRace",con))
                    {
                        con.Open();
                        cmd.CommandType = CommandType.StoredProcedure;
                        SqlParameter param = new SqlParameter();
                        //required for passing a table valued parameter
                        param.SqlDbType = SqlDbType.Structured;
                        param.ParameterName = "@Races";
                        //adding the DataTable
                        param.Value = dt;
                        cmd.Parameters.Add(param);
                        GridView1.DataSource = cmd.ExecuteReader();
                        GridView1.DataBind();
                    }                
                }
            }
            [ScriptMethod]
            [WebMethod]
            //this method will take JS array as a parameter and turn it into a DataTable
            public void TableFilter(string filterList)
            {
                DataTable filter = new DataTable();
                filter.Columns.Add(new DataColumn() { ColumnName = "Races" });
                dt.Columns.Add(new DataColumn() { ColumnName = "Races" });
                foreach (string s in filterList.Split(','))
                {
                    filter.Rows.Add(s);
                }
                dt = filter;
            }
        }
}

如果这是一种完全愚蠢的方法，那么非常欢迎修改：）

使用jQuery将JavaScript数组传递给服务器端函数

这里的问题是，您的web表单上有两个方法，需要一个后返回周期。

  • 当您调用WebMethod时，它将创建_default类的一个实例并设置dt变量，但不对其执行任何操作
  • 调用Button1_Click时，会创建_default类的新实例，因此dt变量设置为new DataTable();。因此，您的参数没有列或其他数据

您将希望用一种方法来处理DataTable，可能是TableFilter方法。

我建议使用JSON来表示您正在传递的数据，JSON是javascript的一个子集。JSON的一个例子是：

[ "string1", "string2" ]

或

{ "property1": "a", "property2": "b" }

其中第一个是有效的javascript数组，第二个是在<script>标记中直接传递给浏览器时的有效javascript对象。JQuery有各种处理JSON的方法，您可以在.NET端查看JSON.NET或ServiceStack.Text，以便将JSON反序列化为C#对象。

[编辑]

尽管我应该指出，很难将JSON反序列化为C#DataTable，因为DataTable有很多客户端不一定需要的属性。最好的办法是反序列化为List<T>，并根据需要在该列表中迭代添加到DataTable行。

相关文章：