0

我有一个看起来像这样的网络方法：

[WebMethod]
        public void InsertDrugNameAndColorToDatabase(string drugName,string drugColor)
        {
            string cs = ConfigurationManager.ConnectionStrings["dbcs"].ConnectionString;
            using (var con = new SqlConnection(cs))
            {
                using (var cmd = new SqlCommand("spInsertDrugText", con))
                {
                    con.Open();
                    cmd.CommandType = CommandType.StoredProcedure;
                    cmd.Parameters.AddWithValue("@drugName", drugName);
                    cmd.Parameters.AddWithValue("@drugColor", drugColor);
                    cmd.ExecuteNonQuery();
                }
            }
        }

和一点 JS：

<script type="text/javascript">
        $(document).ready(function () {
            $(".drugQuizzes").draggable({ tolerance: "fit" });
            $(".drugAnswers").droppable({
                drop: function (event, ui) {
                    var drugName = JSON.stringify({ "drugName": $(ui.draggable).find("span").text() });
                    var drugColor = JSON.stringify({ "drugColor": $(ui.draggable).css("background-color") });
                    console.log(drugColor);
                    console.log(drugName);
                    $.ajax({
                        type: "POST",
                        contentType: "application/json; charset=utf-8",
                        url: "SendDrugName.asmx/InsertDrugNameToDatabase",
                        data: drugName,
                        dataType: "json",
                        success: function (data) {
                            //response(data.d);
                        },
                        error: function (xhr, ajaxOptions, thrownError) {
                            console.log(xhr.status);
                            console.log(thrownError);
                        }
                    });
                }
            });
        });
    </script>
<script type="text/javascript">
        $(document).ready(function () {
            $(".drugQuizzes").draggable({ tolerance: "fit" });
            $(".drugAnswers").droppable({
                drop: function (event, ui) {
                    var drugName = JSON.stringify({ "drugName": $(ui.draggable).find("span").text() });
                    var drugColor = JSON.stringify({ "drugColor": $(ui.draggable).css("background-color") });
                    console.log(drugColor);
                    console.log(drugName);
                    $.ajax({
                        type: "POST",
                        contentType: "application/json; charset=utf-8",
                        url: "SendDrugName.asmx/InsertDrugNameToDatabase",
                        data: drugName,
                        dataType: "json",
                        success: function (data) {
                            //response(data.d);
                        },
                        error: function (xhr, ajaxOptions, thrownError) {
                            console.log(xhr.status);
                            console.log(thrownError);
                        }
                    });
                }
            });
        });
    </script>

我有一个版本的存储过程 ans JS，其中只有一个参数被发送到存储过程，并且有效。从 console.log(drugName) 和 console.log(drugColor) 我得到

{"drugColor":"rgb(255, 69, 0)"} 
{"drugName":"ORACEA"}

如何使dataajax 调用的参数一次采用多个参数？使用 jQuery ajax 一次向存储过程发送多个参数时，我需要注意哪些通用技术名称？

4

3 回答 3

1

您可以指定多个数据项，例如：

data: 'drugName='+ drugName  + '&drugColor=' + drugColor;
于 2013-08-20T15:35:33.060 回答
1

您根本不需要对其进行字符串化，您可以将参数作为对象传递。尝试这个：

$(".drugAnswers").droppable({
    drop: function (event, ui) {
        $.ajax({
            type: "POST",
            contentType: "application/json; charset=utf-8",
            url: "SendDrugName.asmx/InsertDrugNameToDatabase",
            data: {
                'drugName': $(ui.draggable).find("span").text(),
                'drugColor': $(ui.draggable).css("background-color")
            },
            dataType: "json",
            success: function (data) {
                //response(data.d);
            },
            error: function (xhr, ajaxOptions, thrownError) {
                console.log(xhr.status);
                console.log(thrownError);
            }
        });
    }
});

然后，该ajax()函数将为您将其字符串化并将其传递给您的 C# 端点。

于 2013-08-20T15:36:17.247 回答
1

考虑在客户端构建一个对象文字并将整个对象传递给服务，因此您的服务调用中有一个参数，如下所示：

客户端：

var myData = {};
myData.DrugName' = $(ui.draggable).find("span").text();
myData.DrugColor' = $(ui.draggable).css("background-color");

// Create a data transfer object (DTO) with the proper structure, which is what we will pass to the service.
var DTO = { 'theData' : myData };

$.ajax({
    type: "POST",
    contentType: "application/json; charset=utf-8",
    url: "SendDrugName.asmx/InsertDrugNameToDatabase",
    data: JSON.stringify(DTO),
    dataType: "json",
    success: function (data) {
        //response(data.d);
    },
    error: function (xhr, ajaxOptions, thrownError) {
        console.log(xhr.status);
        console.log(thrownError);
    }
});

现在在服务端，您需要构建一个表示上面创建的对象文字内容的类，如下所示：

public class ServiceData
{
    public string DrugName { get; set; }
    public string DrugColor { get; set; }
}

最后，更改您的 Web 服务代码以接受一个参数，如下所示：

[WebMethod]
public void InsertDrugNameAndColorToDatabase(ServiceData theData)
{
    string cs = ConfigurationManager.ConnectionStrings["dbcs"].ConnectionString;
    using (var con = new SqlConnection(cs))
    {
        using (var cmd = new SqlCommand("spInsertDrugText", con))
        {
            con.Open();
            cmd.CommandType = CommandType.StoredProcedure;
            cmd.Parameters.AddWithValue("@drugName", theData.DrugName);
            cmd.Parameters.AddWithValue("@drugColor", theData.DrugColor);
            cmd.ExecuteNonQuery();
        }
    }
}

ServiceData注意：只要客户端和服务器端的名称匹配，从 jQuery 调用传递的数据会自动与您在类中拥有的类属性匹配。

于 2013-08-20T15:52:34.317 回答