使用 ajax get 将表单传递给控制器方法答案

【问题标题】：pass form using ajax get to controller method使用 ajax get 将表单传递给控制器方法
【发布时间】：2020-04-23 08:42:04
【问题描述】：

我是 MVC 编程的新手，所以请原谅这个问题中任何可能的愚蠢。

$(document).ready(function () {
            $("#btnGenerate").click(function () {

                $.ajax({
                    type: "GET",
                    url: '/Main/MyMethod',  
                    data: JSON.stringify($('#searchForm').serializeArray()),                
                    dataType: 'json',
                    error: function (XMLHttpRequest, textStatus, errorThrown) {

                        alert(errorThrown);
                    }
                })
                return false;
            });
        });

还有我在控制器中的方法：

        [HttpGet]
        public FileStreamResult MyMethod(MyModel r)
        {
          return null;
        }

我确实收到 500 内部服务器错误。

【问题讨论】：

什么模型被传入这个视图？
@model MyModel .
我的回答应该能解决这个问题
是否包含 MyModel 类及其属性？谢谢

标签： c# ajax asp.net-mvc model-view-controller

【解决方案1】：

尝试使用serialize() 而不是serializeArray()

$.ajax({
    type: "GET",
        url: '/Main/MyMethod',  
        data: JSON.stringify($('#searchForm').serialize()),                
        dataType: 'json',
        error: function(XMLHttpRequest, textStatus, errorThrown) {

        alert(errorThrown);
    }
})

您也可以尝试将方法属性更改为HttpPost:

[HttpPost]
public FileStreamResult MyMethod(MyModel r)
{
    return null;
}

【讨论】：

太棒了。我会尝试。你也应该编辑你的答案，因为它包含 serializeArray()，对吧？
还是同样的错误。我试过：数据：JSON.stringify($('#searchForm').serialize()),

【解决方案2】：

如果你在发帖，

$.ajax({
    type: "POST",
        url: '/Main/MyMethod',  
        data: {
//your MyModel properties e.g. name
name: "MyName",
age: 1
    },


        success: function(data){
    },
        error: function(XMLHttpRequest, textStatus, errorThrown) {

        alert(errorThrown);
    }
})

【讨论】：

我不想发布数据，那为什么要用POST而不是GET呢？
我不知道你想用上面的代码实现什么。喜欢您要提交表单以生成文件吗？然后只需使用表单提交。不要使用ajax。还是您需要提交表单-> 保存、删除、编辑。 -> 返回 Json 响应。但我认为这是第一个。
我将根据模型值创建一个文件。这就是我想通过模型的原因。
错误 500 表示您的 ajax 调用未通过您的控制器。这是因为它需要一个模型，但您没有提供模型。如果您需要基于表单值创建文件。为什么不通过表单提交而不是通过ajax呢？
我想通过其他按钮生成基于表单值的文件，而不是提交按钮。提交用于其他用途。

【解决方案3】：

如果serialize不起作用，也可以尝试这种方法。

$("#my_form").submit(function(event){
event.preventDefault(); //prevent default action 
var post_url = $(this).attr("action"); //get form action url
var request_method = $(this).attr("method"); //get form GET/POST method
var form_data = $(this).serialize(); //Encode form elements for submission

`$.ajax({
    url : post_url,
    type: request_method,
    data : form_data
}).done(function(response){ //
    $("#server-results").html(response);
});

})`

【讨论】：

【解决方案4】：

$(function(){
    $("#_frmId").submit(function(){
        event.preventDefault();    // Prevent the default behaviour of the form.

        var formdata = $("#_frmId").serialize();    // Serializes the form

        $.ajax({
            url: '@Url.Action("// Method", "// Controller")',
            type:'POST',
            data: formdata,
            success: function(result){
                // Do whatever
            }
        });
    });
})

_frmId表单的ID。

当表单提交时，会调用该方法。

此外，在序列化传递给控制器的数据时，无需对数据进行字符串化处理。

您传递给控制器的是视图模型而不是表单模型。

所以你的控制器动作应该是这样的

public FileStreamResult MyMethod(//<The View model> r)

最后你将数据发布到控制器，所以删除[HttpGet]

【讨论】：

还有，不用[HttpPost]？
我不想发布数据，我只想获取模型。这就是我不想使用帖子的原因
@Akhtubir 没有。可以加但是没必要
@Akhtubir 你是什么意思？您仍然可以从 POST 中返回
我仍然得到：jquery-2.1.3.min.js:4 POST localhost:51014/Main/MyMethod 500（内部服务器错误）