Javascript 如何向mvc控制器发送js变量

Javascript 如何向mvc控制器发送js变量,javascript,jquery,asp.net-mvc,Javascript,Jquery,Asp.net Mvc,我不熟悉客户机-服务器编程概念。我需要的是,将四个js变量发送到我的MVC 3控制器操作 $(document).ready(function() { var $jcrop; $('#image').Jcrop({ bgColor: 'red', onSelect: refreshData }, function () { $jcrop = this;

我不熟悉客户机-服务器编程概念。我需要的是,将四个js变量发送到我的MVC 3控制器操作

    $(document).ready(function() {
        var $jcrop;

        $('#image').Jcrop({
            bgColor: 'red',
            onSelect: refreshData
        }, function () {
            $jcrop = this;
        });

        function refreshData(selected) {
            myData = {
                x1: selected.x1,
                x2: selected.x2,
                y1: selected.y1,
                y2: selected.y2
            };
        }
    });
所以我在浏览器里找到了我的VAR

我在服务器端拥有的是:

    public ActionResult CreateCover(ImageCoordinates coordinates) {
        ViewData.Model = coordinates;
        return View();
    }

public class ImageCoordinates
{
    public int x1 { get; set; }
    public int x2 { get; set; }
    public int y1 { get; set; }
    public int y2 { get; set; }
}
有没有一种简单的方法将我的四个参数从js发布到我的操作? 我尝试使用这个站点的两个示例,使用$.ajax

像这样

        $.ajax({
            url: '/dashboard/createcover',
            type: 'POST',
            data: JSON.stringify(myData),
            contentType: 'application/json; charset=utf-8',
            success: function (data) {
                alert(data.success);
            },
            error: function () {
                alert("error");
            },
            async: false
        });
但它不起作用,我在我的行动中得到了0。但老实说,我甚至不知道如何调用这个jquery函数。我应该单击按钮调用它,还是在我发布表单时它会自动调用?
还有其他方法发送此参数吗?

尝试更改传递给控制器的对象的名称:

$.ajax({
    url: '/dashboard/createcover',
    type: 'POST',
    data: {coordinates : JSON.stringify(myData)}, //change here
    contentType: 'application/json; charset=utf-8',
    success: function (data) {
        alert(data.success);
    },
    error: function () {
        alert("error");
    },
    async: false
});
请注意,这将把值作为JSON对象发布。您需要修改控制器,如下所示:

public ActionResult CreateCover(string jsonCoordinates) {
    ImageCoordinates coordinates = JsonConvert.DeserializeObject<ImageCoordinates >(jsonCoordinates);

    ViewData.Model = coordinates;
    return View();
}

public ActionResult CreateCover(字符串jsonCoordinates){
ImageCoordinates坐标=JsonConvert.DeserializeObject(jsonCoordinates);
ViewData.Model=坐标;
返回视图();
}
您还需要添加对
Newtonsoft.Json
的引用

模型-

public class ImageCoordinates
{
    public int x1 { get; set; }
    public int x2 { get; set; }
    public int y1 { get; set; }
    public int y2 { get; set; }
}
行动-

    public ActionResult CreateCover(ImageCoordinates coordinates)
    {
        return null;
    }
让我们创建一个视图,该视图将对操作进行AJAX调用

<script src="~/Scripts/jquery-1.10.2.min.js"></script>

<script>
    function submitForm() {

        var model = new Object();
        model.x1 = 120;
        model.y1 = 240;
        model.x2 = 360;
        model.y2 = 480;


        jQuery.ajax({
            type: "POST",
            url: "@Url.Action("CreateCover")",
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            data: JSON.stringify({ coordinates: model }),
            success: function (data) {
                alert(data);
            },
            failure: function (errMsg) {
                alert(errMsg);
            }
        });
    }
</script>

<input type="button" value="Click" onclick="submitForm()" />

函数submitForm(){
var model=新对象();
模型x1=120;
模型y1=240;
模型x2=360;
模型y2=480;
jQuery.ajax({
类型:“POST”,
url:“@url.Action”(“CreateColver”)”,
数据类型:“json”,
contentType:“应用程序/json;字符集=utf-8”,
数据:JSON.stringify({coordinates:model}),
成功:功能(数据){
警报(数据);
},
失败:函数(errMsg){
警报(errMsg);
}
});
}
输出-


不。。MVC内置json模型绑定器,无需Deserialize@AlexanderTaran,我部分同意。如果您对传递的字典稍加处理,您很快就会得出结论,某些解析必须在控制器中显式完成。@AndreiV首先感谢您的帮助和时间。我试图使用你的代码,但收到500个严重错误。
POSThttp://localhost:42771/dashboard/createcover 500(内部服务器错误)jquery-1.7.1.min.js:4 send jquery-1.7.1.min.js:4 f.extend.ajax jquery-1.7.1.min.js:4 submitForm Imgedit:21 onclick
我应该如何执行$.ajax函数?我将其粘贴到submitForm()funk中,单击按钮时会调用它。@AndreiV ok。不过,非常感谢您的帮助。突出显示最重要的部分“data:JSON.stringify({coordinates:model})”,谢谢您,我测试了这个,并且在我的控制器操作中收到了变量。另外一个问题是,如何使用我收到的参数呈现另一个视图。public ActionResult CreateCover(ImageCoordinates坐标){ViewData.Model=coordinates;return view();}这是我的视图代码,但我仍然在发送参数的页面上。在调试中,我收到了我的变量,但视图没有呈现。@CadmusX,我很高兴你解决了这个问题。对于其他问题,请将其作为单独的问题发布。@Ramilu我可以让一个控制器工作,但是否可以将其传递给多个控制器?