Question

这是我的表格

<form id="postProblemForm" action="/Problems/Post"  method="post" enctype="multipart/form-data">
            <input type="text" id="problemSubject" name="problemSubject" class="inp-form"/>
            <input type="file" id="uploadFile" name="uploadFile"/>
            <textarea rows="" cols="" class="form-textarea" id="problemDescription" name="problemDescription"></textarea>
            <input type="submit" value="Post" id="btnPostProblem"  style="width:70px;"/>

    </form>

以下是JS

$("#postProblemForm").submit(function (event) {
                event.preventDefault();
                var $this = $(this);
                var url = $this.attr('action');
                var dataToSend = $this.serialize();
                var callBack = function (isPosted) {
                                    if (isPosted) { alert("posted successfully"); } }
                $.get(url,dataToSend,callBack);

            });

以下是控制器代码

[HttpPost]
        public bool Post(FormCollection form) 
        {
            string subject = form["problemSubject"];
            string description = form["problemDescription"];
            var image = WebImage.GetImageFromRequest();

            return true;

        }

但是没有调用控制器方法。请帮助。

Answer 1

您无法使用AJAX上传文件。我看到你的表单包含一个文件输入，但这不适用于AJAX。您也使用$.get，而您可能想要$.post内容。你的行动的另一个问题是它应该返回一个ActionResult而不是布尔类型。例如，你可以返回一个JsonResult for tat。

如果您希望能够使用表单上传文件，可以使用客户端上传插件，例如Uploadify，Fine Uploader或jQuery.form plugin。

以下是使用jQuery.form插件编写代码的示例：

$('#postProblemForm').ajaxForm(function(isPosted) {
    if (isPosted) { 
        alert('posted successfully');
    }
});

Answer 2

您正在对接受GET请求的控制器方法执行POST。您需要将其更改为：

$.post(url,dataToSend,callBack);

将表单发送到ajax中的控制器

2 个答案: