Mvc Ajax以文件上传获取错误开始表单?

时间:2016-01-08 06:53:59

标签: jquery ajax asp.net-mvc asp.net-mvc-4 ajax.beginform

我使用mvc ajax开始表单,当我尝试上传文件时。我在Chrome中遇到VM454:1 Uncaught SyntaxError: Unexpected token u错误。这是代码段

partialView Info.cshtml

@using (Ajax.BeginForm("ChangeInfo", "Users",
        new AjaxOptions
        {
            HttpMethod = "Post",
            InsertionMode = InsertionMode.Replace,
            UpdateTargetId = "tab1-item2"
        },
        new { enctype = "multipart/form-data" }
    ))
    {
        @Html.AntiForgeryToken()
        @Html.ValidationSummary(true, "", new { @class = "text-validate" })
        <img id="img1" src= "@Html.DisplayFor(model => model.Image)"  class="img-thumbnail" />
        <input id="imgInp" name="file" type="file" />      
        <label>FullName</label>
        <h6 style="color: red">@Html.ValidationMessageFor(p => p.FullName)</h6>
        @Html.TextBoxFor(p => p.FullName, new { @class = "form-control", @maxlength = "50" })
        <button type="submit" id="bt_change_info">Change</button>    
    }

查看Index.cshtml

 <div class="tab-pane fade" id="tab1-item2">
      @Html.Action("PVInfo", "Users")
 </div>

和控制器用户

public PartialViewResult PVInfo() {
  var UserID = (Session["CurrentUser"] as USER).USER_ID;
  var user_info = (from users in db.USERS where users.USER_ID == UserID select new UserInfoModel {
                   FullName = users.FULL_NAME,
                   Image = users.IMAGE,
                   }).FirstOrDefault();
  return PartialView("Info", user_info);
}

[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult ChangeInfo(UserInfoModel model, HttpPostedFileBase file) {
  var UserID = (Session["CurrentUser"] as USER).USER_ID;
  USER userinfo = db.USERS.Where(e => e.USER_ID == UserID && e.FLAG == true).FirstOrDefault();
  if (ModelState.IsValid) {
    userinfo.FULL_NAME = model.FullName;
    db.SaveChanges();
    if (file != null && file.ContentLength > 0) {
      //var fileName = Path.GetFileName(file.FileName);
      var fileName = UserID + ".PNG";
      var path = Path.Combine(Server.MapPath("~/User_IMG"), fileName);
      file.SaveAs(path);
    }
    return PartialView("Info", model);
  } else
    return PartialView("Info", model);
}

这里的问题是什么?你能告诉我一些错误或错误吗?并给我一些建议,或使用jquery ajax提交表单

$("#idForm").submit(function() {
    //var formData = new FormData($(this)[0]);
    $.ajax({
        url: "/Users/ChangeInfo",
        type: "POST",
        //data: formData,
        //async: false,
        cache: false,
        contentType: html,
        //proccessData: false,
        success: function(result) {
            // do something smart here
        }
    });
});

1 个答案:

答案 0 :(得分:0)

正如你所说,我只需要更改ajax作为按钮sumbit with id&#34; bt_change_info&#34; ,并删除ajax开始表单。你确定吗?。请再次确认并给我一些片段代码答案。非常感谢 。

   $('#bt_change_info').click(function (e) {
        e.preventDefault();
        var formdata = new FormData($('form').get(0));
        $.ajax({
            url: '/Users/ChangeInfo',
            type: 'POST',
            cache: false,
            processData: false,
            data: formdata ,
            success: function (result) { 
                $('#tab1-item3').html('');
                $('#tab1-item3').html(result);
            },
            error: function (result) {
                alert("Error Change");
            }
        });
    });