Ajax.BeginForm does not insert partial view

Question

Running ASP.NET MVC 2015 with C#. Trying to add a partial view as a result of @using (Ajax.BeginForm(...) All it does is to open a new page with my partial view in it. I found some answers in stackoverflow, but none works for me, unless I missed something.

Scenario: index page here Type A, B or C and partial view is expected below the current page

new page unexpected here But it does open a new page instead

Controler:

public class TestController : Controller
{
    public ActionResult Index()
    {
        return View();
    }

    [ChildActionOnly]
    public ActionResult TestPartial()
    {
        ChoiceViewModel vm = new ChoiceViewModel();
        return View(vm);
    }

    [HttpPost]
    public ActionResult SelectChoice(ChoiceViewModel vm)
    {
        ModelState.Clear();
        if (vm.MyChoice == "A")
            return PartialView("APartial");

        if (vm.MyChoice == "B")
            return PartialView("BPartial");

        if (vm.MyChoice == "C")
            return PartialView("CPartial");

        return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
    }
}

Index.cshtml:

<h2>Index</h2>
<div>
   @Html.Partial("TestPartial")
</div>
<br/>
<div id="GoesHere">
</div>

TestPartial.cshtml:

@model TestPartial.ViewModels.ChoiceViewModel

@using (Ajax.BeginForm("SelectChoice", new AjaxOptions { HttpMethod = "POST", UpdateTargetId = "GoesHere", InsertionMode = InsertionMode.Replace }))
{
   <div class="form-group">
       <p>Give your choice please: A,B or C</p>
       @Html.TextBoxFor(x => x.MyChoice, new { @class = "form-control" })
   </div>
   <div class="form-group">
       <input type="submit" class="btn btn-primary" value="Select">
   </div>
}

APartial.cshtml (as well as B and C...)

<p>This is A choice</p>

Notes:

Yes, web.config has UnobtrusiveJavaScriptEnabled=true and ClientValidationEnabled=true
Yes, I installed the jquery.unobtrusive-ajax package

Can you tell me what I missed or did wrong ? Thanks

It means you making a normal submit which happens because your scripts are not loaded correctly or are loaded in the wrong order. — , Apr 02 '18 at 21:51
@StephenMuecke: thanks for the answer, but not very clear to me. Can you tell me exactly in that dummy scenario what would need to be changed ? — Château Palmer, Apr 03 '18 at 15:01
@Sarhang: does not change the behaviour if I redirect the view model to the partial views. — Château Palmer, Apr 03 '18 at 15:02
this answer might help: https://stackoverflow.com/questions/17095443/how-to-use-simple-ajax-beginform-in-asp-net-mvc-4 — Hooman Bahreini, Apr 03 '18 at 22:16
@Sarhang. Thanks! My missing piece was to assert the script line : — Château Palmer, Apr 04 '18 at 12:47

score 0 · Accepted Answer · answered Apr 04 '18 at 14:10

0

The answer was that I was missing the unobtrusive-ajax inclusion line in my cshtml :

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

answered Apr 04 '18 at 14:10

Château Palmer

1
1

Ajax.BeginForm does not insert partial view

1 Answers1