Javascript 如何在mvc4中从视图向api控制器发送多个参数

我有多个参数，我必须传递给api控制器

我所做的是

在我的javascript中

            var routeInfo = JSON.stringify(routes);
            var colors = JSON.stringify(colorsArray);
            var times = JSON.stringify(mytimeArray);
            var distances = JSON.stringify(myDistancArray);
            var dir = $("#Direction").val();

          var fullString = routeInfo + ";" + colors + ";" + times + ";" + distances+";"+dir;

            $.post("api/HomeToSchool/?route=" + fullString,
                function (data) {
                    if (data = true) {
                        alert("Routes Saved Successfully");
                    }
                    else if (data = false) {
                        alert("Routes are not saved");
                    }
                });

&在我的控制器中

public bool PostHomeToSchoolRoutes([FromUri]string route)
        {
// my logic
}

这里我只得到了“routeInfo”的值&其他值不存在。 e、 g

我在控制器中得到的是

[["Børge,Brogade  38, 4100, Ringsted,09:25:00,55.43953, 11.79043","Grete,Sjællandsgade  27, 4100, Ringsted,09:25:00,55.44024, 11.78852","Else,Fynsgade  14, 4100, Ringsted,09:25:00,55.44128, 11.78595","Birthe,Eksercerpladsen  47, 4100, Ringsted,09:25:00,55.44954, 11.80309","Knud Lavard Centret, Eksercerpladsen 3,  4100,  Ringsted,370,55.45014, 11.80474"]];["

其他价值观不会到来。

---

我在这里做错了什么。

恐怕你的url太长（>255个字符），你可以试试这个

$.ajax({
     type: 'POST',
     url:"api/HomeToSchool",
     data:{routeInfo:routes,colors:colorsArray,times:mytimeArray,distances:myDistancArray,dir:dir},
     dataType: "json",
     traditional:true,
     function (data) {
                        if (data = true) {
                            alert("Routes Saved Successfully");
                        }
                        else if (data = false) {
                            alert("Routes are not saved");
                        }
                    }
});

和您的控制器：

public bool PostHomeToSchoolRoutes(string[] routeInfo,string[] colors,double[] times,double[] distances,int dir)
        {
// my logic
}

---

我看到你在用二维数组来表示routeInfo。但是只有一项，我认为您应该将其更改为一维数组，以使其与控制器代码

string[]routeInfo

兼容。恐怕您的url太长（>255个字符），您可以试试这个

$.ajax({
     type: 'POST',
     url:"api/HomeToSchool",
     data:{routeInfo:routes,colors:colorsArray,times:mytimeArray,distances:myDistancArray,dir:dir},
     dataType: "json",
     traditional:true,
     function (data) {
                        if (data = true) {
                            alert("Routes Saved Successfully");
                        }
                        else if (data = false) {
                            alert("Routes are not saved");
                        }
                    }
});

和您的控制器：

public bool PostHomeToSchoolRoutes(string[] routeInfo,string[] colors,double[] times,double[] distances,int dir)
        {
// my logic
}

---

我看到你在用二维数组来表示routeInfo。但是只有一项，我认为您应该将其更改为一维数组，以使其与控制器代码

string[]routeInfo

兼容。在URL中输入的信息太多，不仅是您没有正确地将参数附加在一起，还需要使用

&

而不是

将它们分开

最重要的是，您并没有真正利用这里的MVC功能。在客户端，您希望将信息作为一个集合对象而不是单个参数发送，例如

var schoolRoutes = {
    routes: routes,
    colors: colorsArray,
    times: mytimeArray,
    distances: myDistanceArray,
    direction: $("#Direction").val()
};

$.ajax({
    type: 'POST'
    url: "api/HomeToSchoolRoutes",
    data: JSON.stringify(schoolRoutes),
    dataType: "json",
    success: function (data) {
        if (data = true) {
            alert("Routes Saved Successfully");
        }
        else if (data = false) {
            alert("Routes are not saved");
        }
});

然后在服务器端，引入一个类，该类将能够绑定到传入数据aka
ViewModel

public class RouteInfoViewModel
{
    ...
}

public class SchoolRoutesViewModel
{
    public RouteInfoViewModel[] Routes { get; set; }
    public string[] Colours { get; set; }
    public double[] Times { get; set; }
    public double[] Distances { get; set; }
    public string Direction { get; set; }
}

然后更新您的操作以预期此特定的
ViewModel
，这样您就可以访问发布的所有信息

public bool PostHomeToSchoolRoutes(SchoolRoutesViewModel schoolRoutes)
{
    ...
}

这里有太多的信息进入URL，不仅是您没有正确地将参数附加在一起，还需要使用
&
而不是
将它们分开

最重要的是，您并没有真正利用这里的MVC功能。在客户端，您希望将信息作为一个集合对象而不是单个参数发送，例如

var schoolRoutes = {
    routes: routes,
    colors: colorsArray,
    times: mytimeArray,
    distances: myDistanceArray,
    direction: $("#Direction").val()
};

$.ajax({
    type: 'POST'
    url: "api/HomeToSchoolRoutes",
    data: JSON.stringify(schoolRoutes),
    dataType: "json",
    success: function (data) {
        if (data = true) {
            alert("Routes Saved Successfully");
        }
        else if (data = false) {
            alert("Routes are not saved");
        }
});

然后在服务器端，引入一个类，该类将能够绑定到传入数据aka
ViewModel

public class RouteInfoViewModel
{
    ...
}

public class SchoolRoutesViewModel
{
    public RouteInfoViewModel[] Routes { get; set; }
    public string[] Colours { get; set; }
    public double[] Times { get; set; }
    public double[] Distances { get; set; }
    public string Direction { get; set; }
}

然后更新您的操作以预期此特定的
ViewModel
，这样您就可以访问发布的所有信息

public bool PostHomeToSchoolRoutes(SchoolRoutesViewModel schoolRoutes)
{
    ...
}

我刚刚更新了关于二维数组路由的答案。请尝试将时间、距离和方向的数据类型更新为正确的数据类型。查看我的更新答案。我刚刚更新了关于二维数组路由的答案。请尝试将时间、距离和方向的数据类型更新为正确的数据类型。请参阅我的更新答案。HomeToSchool是控制器名称，PostHomeToSchoolRoutes是该控制器中的方法。没有注意到在这种情况下我们不应该使用JSON.stringify，而是让jquery为我们序列化参数。有三件事需要检查：不要使用JSON.stringify，添加“traditional:true”，并确保“routes”javascript数组是一维的。查看下面我的更新答案（已测试）HomeToSchool是该控制器中的控制器名称，PostHomeToSchoolRoutes是该控制器中的方法。没有注意到在这种情况下我们不应该使用JSON.stringify，而是让jquery为我们序列化参数。有三件事需要检查：不要使用JSON.stringify，添加“traditional:true”，并确保“routes”javascript数组是一维的。查看下面我的更新答案（已测试），然后在服务器端，介绍一个能够绑定到传入数据的类，也就是ViewModel，我不理解这一行。使用MVC参数可以自动映射到一个类，只要它包含相关属性。因此，定义一个类，并为其提供您希望从客户机接收的属性&使其成为操作的参数。我已经给出了一个示例，然后在服务器端，介绍了一个能够绑定到传入数据的类，也就是ViewModel，我不理解这一行。使用MVC参数可以自动映射到一个类，只要它包含相关属性。因此，定义一个类，并为其提供您希望从客户机接收的属性&使其成为操作的参数。我举了一个例子