Databases
StackOverflow2013
Postsdbo
POAjax with asp.net mvc Partial view is not working correctly
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POAjax with asp.net mvc Partial view is not working correctly
    text
    copied!<p>I am trying to do a simple example of ajax with mvc but its not working correctly I am based on wrox, professional asp.net mvc 3 book, chapter 8, and plural sight ajax video.</p> <p>I will paste the code of the relevant code files here, I think it might be a problem with the scripts but I am not really sure.</p> <pre><code>_layout.csthml (Script partial view and non mandatory section at the end) &lt;html&gt; &lt;head&gt; &lt;meta charset="utf-8" /&gt; &lt;title&gt;@ViewBag.Title&lt;/title&gt; @Html.Partial("_css") &lt;/head&gt; &lt;body&gt; &lt;div class="page"&gt; &lt;header&gt; &lt;div id="title"&gt; &lt;h1&gt;Eva 1.0&lt;/h1&gt; &lt;/div&gt; &lt;div id="logindisplay"&gt; @Html.Partial("_LogOnPartial") &lt;/div&gt; &lt;nav&gt; &lt;ul id="menu"&gt; @if(Request.IsAuthenticated) { &lt;li&gt; @Html.ActionLink("DashBoard", "Index", "Home")&lt;/li&gt; &lt;li&gt; @Html.ActionLink("Positions", "Index", "Position") &lt;/li&gt; &lt;li&gt; @Html.ActionLink("Prospects", "Position", "UserPositionPosition") &lt;/li&gt; &lt;li&gt; @Html.ActionLink("Prospect History", "Position", "UserPositionPosition") &lt;/li&gt; &lt;li&gt; @Html.ActionLink("Technical Interview", "Position", "UserPositionPosition") &lt;/li&gt; &lt;li&gt; @Html.ActionLink("Manager Interview", "Position", "UserPositionPosition") &lt;/li&gt; &lt;li&gt; @Html.ActionLink("Current Employees", "Position", "UserPositionPosition") &lt;/li&gt; &lt;li&gt; @Html.ActionLink("Current Employees History", "Position", "UserPositionPosition") &lt;/li&gt; } @* else { &lt;li&gt; @Html.ActionLink("Log On", "LogOn", "Account") &lt;/li&gt; }*@ &lt;/ul&gt; &lt;/nav&gt; &lt;/header&gt; &lt;section id="main"&gt; @RenderBody() &lt;/section&gt; &lt;footer&gt; &lt;/footer&gt; &lt;/div&gt; @Html.Partial("_scripts") @RenderSection("scripts", false) &lt;/body&gt; &lt;/html&gt; _scripts.cshtml &lt;script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.6.4.min.js" type="text/javascript"&gt;&lt;/script&gt; Index.cshtml (Where I am trying to achieve the ajax effect) @model ICollection&lt;Data.Model.Position&gt; @{ ViewBag.Title = "Index"; Layout = "~/Views/Shared/_Layout.cshtml"; } @section scripts{ &lt;script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.min.js" type="text/javascript"&gt;&lt;/script&gt; &lt;script src="http://ajax.aspnetcdn.com/ajax/mvc/3.0/jquery.validate.unobtrusive.min.js" type="text/javascript"&gt;&lt;/script&gt; } &lt;h2&gt;Index&lt;/h2&gt; &lt;p&gt; @Html.ActionLink("Create New", "Create") &lt;/p&gt; &lt;div id="dailydeal"&gt; @Ajax.ActionLink("Click here to see today's special!", "Create", "Position", new AjaxOptions{ UpdateTargetId="dailydeal", InsertionMode=InsertionMode.Replace, HttpMethod="POST", LoadingElementDuration=5000, LoadingElementId="progress" }) &lt;/div&gt; &lt;div id="progress"&gt; Loading... &lt;/div&gt; &lt;table&gt; &lt;tr&gt; &lt;th&gt; name &lt;/th&gt; &lt;th&gt; yearsExperienceRequired &lt;/th&gt; &lt;th&gt; Actions &lt;/th&gt; &lt;/tr&gt; @foreach (var item in Model) { &lt;tr&gt; &lt;td&gt; @Html.DisplayFor(modelItem =&gt; item.name) &lt;/td&gt; &lt;td&gt; @Html.DisplayFor(modelItem =&gt; item.yearsExperienceRequired) &lt;/td&gt; &lt;td&gt; @Html.ActionLink("Edit", "Edit", new { id=item.PositionID }) | @Html.ActionLink("Details", "Details", new { id = item.PositionID }) | @Html.ActionLink("Delete", "Delete", new { id = item.PositionID }) &lt;/td&gt; &lt;/tr&gt; } &lt;/table&gt; _Create.cshtml (Partial view with the create form) @{ ViewBag.Title = "Create"; Layout = "~/Views/Shared/_Layout.cshtml"; } &lt;h2&gt;Create&lt;h2&gt; @using (Html.BeginForm()) { @Html.ValidationSummary(true) &lt;fieldset&gt; &lt;legend&gt;Position&lt;/legend&gt; &lt;div class="editor-label"&gt; @Html.LabelFor(model =&gt; model.name) &lt;/div&gt; &lt;div class="editor-field"&gt; @Html.EditorFor(model =&gt; model.name) @Html.ValidationMessageFor(model =&gt; model.name) &lt;/div&gt; &lt;div class="editor-label"&gt; @Html.LabelFor(model =&gt; model.yearsExperienceRequired) &lt;/div&gt; &lt;div class="editor-field"&gt; @Html.EditorFor(model =&gt; model.yearsExperienceRequired) @Html.ValidationMessageFor(model =&gt; model.yearsExperienceRequired) &lt;/div&gt; &lt;p&gt; &lt;input type="submit" value="Create" /&gt; &lt;/p&gt; &lt;/fieldset&gt; } &lt;div&gt; @Html.ActionLink("Back to List", "Index") &lt;/div&gt; Position Controller method /// &lt;summary&gt; /// Create form of the position /// &lt;/summary&gt; /// &lt;returns&gt;&lt;/returns&gt; public PartialViewResult Create() { Thread.Sleep(2000); return PartialView("_Create"); } </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload