4

I have read many of similar questions on the web but still can't figure out the problem. My Ajax.BeginForm returns a message through PartialView in Controller but the string replaces the entire page.

View:

   @using (Ajax.BeginForm("NoMoreItem", "ProductListing", 
new AjaxOptions
{
HttpMethod = "get",
InsertionMode = InsertionMode.Replace,
UpdateTargetId = string.Concat("NoMoreItemSection1-", counter)
}, new { @id = string.Concat("NoMoreItemForm1-", counter) }))
{
    <input type="hidden" value="@Model.Email" name="email" />
    <input type="hidden" value="@i.code" name="code" />
    <input type="submit" value="notify me" />
}
</div>

My Controller:

public ActionResult NoMoreItem(string email, string productCode)
{
    string message;
    _waitinglist.Save(email, productCode);
    message = "Item added to Waiting List";
    return PartialView("ItemAdded", message);
}

ItemAdded View:

@model string
<div>
    @Model
</div>

I referenced jquery.unobtrusive-ajax.js file in _Layout.cshtml so it seems not be the reason.

Does anyone have idea why the message replace the entire page?

tereško
  • 58,060
  • 25
  • 98
  • 150
jkl
  • 675
  • 2
  • 8
  • 23
  • When this happens, most of the time it's because of improper script loading. See here http://stackoverflow.com/questions/23895918/mvc5-ajax-beginform-and-the-correct-scripts-load-order – Jasen Apr 30 '15 at 18:47
  • What does the rendered HTML look like before you click the button? – Jasen Apr 30 '15 at 19:16
  • @Jasen a table with a item name and a button. I included the js file in the layout but I am not using a layout in ItemAdded View. Maybe it can be the reason? If so, should I reference the js file in partial view or parent view? – jkl Apr 30 '15 at 19:33
  • ItemAdded is a partial and should load into the other view with the layout -- that's fine. Check that you don't have errors on the debug console. Check the rendered html that you have _jquery.js_ then _jquery.unobtrusive-ajax.js_. Make sure your ids are unique on the page. Where's the target id `NoMoreItemSection1-counter` on the main view? – Jasen Apr 30 '15 at 20:32

3 Answers3

1

Make sure you reference MS files 

 <script src="../../Scripts/MicrosoftAjax.js" type="text/javascript"></script>
    <script src="../../Scripts/MicrosoftMvcAjax.js" type="text/javascript"></script>

also I think you looking to post and not get.

COLD TOLD
  • 13,513
  • 3
  • 35
  • 52
  • These scripts are obsolete http://stackoverflow.com/questions/8782697/are-microsoftajax-js-microsoftmvcajax-js-and-microsoftmvcvalidation-js-obsolete – Jasen Apr 30 '15 at 18:46
  • But you still have to include them. – COLD TOLD Apr 30 '15 at 18:54
  • no, it doesn't work. The weird thing is that when I click the button before the page fully load, it works. But stop working after the page fully loaded. So weird. – jkl Apr 30 '15 at 19:00
0

Double check if your jquery.unobtrusive-ajax.js is correctly loaded in the page and check the name of your productcode in the input tag (should be equal of the action parameter).

Let me know if this solves your problem.

Carlos Araujo
  • 414
  • 3
  • 7
  • `bundles.Add(new ScriptBundle("~/bundles/js").Include("~/Scripts/jquery.unobtrusive-ajax.js"));` – jkl Apr 30 '15 at 18:17
  • no, it doesn't work. The weird thing is that when I click the button before the page fully load, it works. But stop working after the page fully loaded. So weird. – jkl Apr 30 '15 at 19:00
0

For those who went round and round on google and couldn't found solution,

make sure web.config has UnobtrusiveJavaScriptEnabled=true in appsettings .

mytech
  • 1