CODEWITHSUNDEEP
asp.netajaxasp.net-mvcasp.net-mvc-4
adamwtiko
adamwtiko

Reputation: 2905

ASP.NET MVC 4 AJAX Submit Form not working

I'm trying to convert a form from synchronous to asynchronous using the Ajax.BeginForm helper method in MVC 4.

In my view I have:

   @{
        ViewBag.Title = "Users > Edit";
        var options = new AjaxOptions()
                          {
                              Url = Url.Action("Edit", "User"),
                              LoadingElementId = "saving",
                              LoadingElementDuration = 2000,
                              Confirm = "Are you sure you want to save this User?"
                          };  
    }

    <div id="saving" style="display:none; color:Red; font-weight: bold"> 
         <p>Saving...</p> 
    </div> 

    @using (Ajax.BeginForm(options)) 
    {
        @Html.ValidationSummary(true)
        <fieldset>
            .... FIELDS ...
            <p>
                <input type="submit" value="Save" />
            </p>
        </fieldset>
    }

When the submit button is clicked a complete postback is being executed. My action method looks like this:

[HttpPost]
public ActionResult Edit(User user)
{
    if (ModelState.IsValid)
    {
        _repository.Save(user);
        TempData["message"] = String.Format("{0} has been saved.", user.Username);
    }

    return View(user);
 }

Is there something I'm missing? Has the MVC 4 current release got a few problems?

In my Web.Config I do have ClientValidationEnabled and UnobtrusiveJavaScriptEnabled set to true.

I also have these specified in my _Layout.cshtml:

    <script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>

Upvotes: 14

Views: 22236

Answers (3)

goqu
goqu

Reputation: 1

I had the same kind of problem... I've updated all the js files with nuget package console.

just my 2 cents, but also at the time of writing, the jquery.unobtrusive.ajax file does contain calls to the deprecated jquery function '.live' (=> it's deleted from jquery 1.9+ version) jquery live

I think there are like 4 occurrences that you'll have to change with .on, now it works fine ;-)

Upvotes: 0

Darin Dimitrov
Darin Dimitrov

Reputation: 1039438

Is there something I'm missing?

Maybe you are missing the unobtrusive ajax script:

<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>

Upvotes: 28

Ravi Gadag
Ravi Gadag

Reputation: 15881

if i am understood correct, you are trying to post the data to controller, after successful you need to go to home page ?? if not can you clarify. so that will try to help you 

if (ModelState.IsValid)
    {
        _repository.Save(user);
        TempData["message"] = String.Format("{0} has been saved.", user.Username);
        return RedirectToAction("yourActionToRedirect");  // after succesfull it will go to the index view
    }

Upvotes: 0

Related Questions