Mvc Ajax begin form with file upload get error?

Question

I using mvc ajax begin form , when i try file upload . I get error as VM454:1 Uncaught SyntaxError: Unexpected token u in chrome. This is code snippet

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>    
    }

View Index.cshtml

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

And controller User

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);
}

What the issue in here ? Can you tell me some mistake or wrong ? and give me some advices , or use jquery ajax submit form

$("#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
        }
    });
});

You cannot use `Ajax.BeginForm()` to upload a file (and your not cancelling the default submit so your submitting twice). You can use use `FormData` as per [this answer](http://stackoverflow.com/questions/29293637/how-to-append-whole-set-of-model-to-formdata-and-obtain-it-in-mvc/29293681#29293681) — , Jan 08 '16 at 07:02
Dear @Ubiquitous Developers , when i click button submit in browser , i get error `VM454:1 Uncaught SyntaxError: Unexpected token u` — Brian Crist, Jan 08 '16 at 07:07

score 0 · Answer 1 · answered Jan 08 '16 at 07:20

as you say , I need change only ajax as button sumbit with id "bt_change_info" , and remove ajax begin form . Are you sure ?.Please confirm again and give me some snippet code answer . Thank you so much .

   $('#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");
            }
        });
    });

Mvc Ajax begin form with file upload get error?

1 Answers1