Databases
StackOverflow2013
Postsdbo
POAjax.BiginForm Causes Postback. I have both the Ajax Scripts included also there are no nested forms
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POAjax.BiginForm Causes Postback. I have both the Ajax Scripts included also there are no nested forms
    text
    copied!<p>I am trying to use Ajax.BefinForm(), and have tried everything available on net to avoid getting a post back. I just cannot figure out what i have done wrong. Please help me with this.</p> <p>Main View:</p> <pre><code>@model GenericApp.Models.ExperienceModel &lt;script src="@Url.Content("~/Scripts/MicrosoftAjax.js")" type="text/javascript"&gt;&lt;/script&gt; &lt;script src="@Url.Content("~/Scripts/MicrosoftMvcAjax.js")" type="text/javascript"&gt;&lt;/script&gt; &lt;script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"&gt;&lt;/script&gt; &lt;script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"&gt;&lt;/script&gt; @{ ViewBag.Title = "Details"; var comments = Model.Comments == null ? new GenericApp.Models.Comments() : Model.Comments; //comments. } &lt;h2&gt;Details&lt;/h2&gt; &lt;p&gt; @Html.ActionLink("Edit", "Edit", new { id = Model.ID }) | @Html.ActionLink("Back to List", "Index") &lt;/p&gt; &lt;fieldset&gt; &lt;legend&gt;ExperienceModel&lt;/legend&gt; &lt;div class="display-field"&gt; &lt;h2&gt; @Html.DisplayFor(model =&gt; model.Title) &lt;/h2&gt; &lt;/div&gt; &lt;div class="display-field"&gt; @Html.DisplayFor(model =&gt; model.Description) &lt;/div&gt; &lt;div class="display-field"&gt; &lt;b&gt;Created By:&lt;/b&gt; @Html.DisplayFor(model =&gt; model.CreatedBy) &lt;/div&gt; &lt;div class="display-field"&gt; &lt;b&gt;Create Date:&lt;/b&gt; @Html.DisplayFor(model =&gt; model.CreateDate) &lt;/div&gt; &lt;div class="display-field"&gt; &lt;b&gt;Modified By:&lt;/b&gt; @Html.DisplayFor(model =&gt; model.ModifiedBy) &lt;/div&gt; &lt;div class="display-field"&gt; &lt;b&gt;Modified Date:&lt;/b&gt; @Html.DisplayFor(model =&gt; model.ModifiedDate) &lt;/div&gt; &lt;/fieldset&gt; @if (User.Identity.Name == null || User.Identity.Name.Length == 0) { &lt;div&gt;To view or add comments, please log-in&lt;/div&gt; } else { &lt;div id="ShowAllComments"&gt; @Html.Partial("_ShowComments", comments) &lt;/div&gt; } </code></pre> <p>Partial View "_ShowComments"</p> <pre><code>@model GenericApp.Models.Comments &lt;table&gt; &lt;tr&gt; &lt;th&gt; Description &lt;/th&gt; &lt;th&gt; CreatedBy &lt;/th&gt; &lt;th&gt; CreateDate &lt;/th&gt; &lt;/tr&gt; @foreach (var item in Model.CommentList) { &lt;tr&gt; &lt;td&gt; @Html.DisplayFor(modelItem =&gt; item.Description) &lt;/td&gt; &lt;td&gt; @Html.DisplayFor(modelItem =&gt; item.CreatedBy) &lt;/td&gt; &lt;td&gt; @Html.DisplayFor(modelItem =&gt; item.CreateDate) &lt;/td&gt; &lt;/tr&gt; } &lt;/table&gt; @{ GenericApp.Models.Comment comment = new GenericApp.Models.Comment(); AjaxOptions opts = new AjaxOptions() { UpdateTargetId = "ShowAllComments", HttpMethod = "POST", Confirm = "Are you sure you want to save your comments", InsertionMode = InsertionMode.Replace }; using (Ajax.BeginForm("StoreComments", new { id = Model.ParentID}, opts, new { id = "ajaxForm" })) { Html.ValidationSummary(true); &lt;fieldset&gt; &lt;div class="editor-field"&gt; @Html.LabelFor(model =&gt; comment.Description)&lt;/div&gt; &lt;div class="editor-field"&gt; @Html.EditorFor(model =&gt; comment.Description) @Html.ValidationMessageFor(model =&gt; comment.Description) &lt;/div&gt; &lt;/fieldset&gt; &lt;input type="submit" value="Save" /&gt; } } </code></pre> <p>Action Code in my controller:</p> <pre><code> [AcceptVerbs(HttpVerbs.Post)] public ActionResult StoreComments(int id, FormCollection collection) { if (Request.IsAjaxRequest()) { ExperienceModel exp = getExpById(id); if (exp.Comments == null) { exp.Comments = new Comments(); exp.Comments.ParentID = exp.ID; exp.Comments.CommentList = new List&lt;Comment&gt;(); } Comment com = new Comment(); com.Description = Request.Params["comment.Description"]; com.CreatedBy = User.Identity.Name; com.CreateDate = new DateTime().ToString(); com.ID = exp.Comments.CommentList.Count; exp.Comments.CommentList.Add(com); return PartialView("_ShowComments", exp.Comments); } else { return this.Content("Hi"); } } </code></pre> <p>I alway end up seeing "Hi" in a blank page </p> <p>Rendered HTML:</p> <pre><code>&lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt;Details&lt;/title&gt; &lt;link href="/Content/Site.css" rel="stylesheet" type="text/css" /&gt; &lt;script src="/Scripts/jquery-1.5.1.min.js" type="text/javascript"&gt;&lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;div class="page"&gt; &lt;div id="header"&gt; &lt;div id="title"&gt; &lt;h1&gt;My MVC Application&lt;/h1&gt; &lt;/div&gt; &lt;div id="logindisplay"&gt; Welcome &lt;strong&gt;sadanands&lt;/strong&gt;! [ &lt;a href="/Account/LogOff"&gt;Log Off&lt;/a&gt; ] &lt;/div&gt; &lt;div id="menucontainer"&gt; &lt;ul id="menu"&gt; &lt;li&gt;&lt;a href="/"&gt;Home&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="/Home/About"&gt;About Us&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="/Experience"&gt;Our Experience&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;/div&gt; &lt;div id="main"&gt; &lt;script src="/Scripts/MicrosoftAjax.js" type="text/javascript"&gt;&lt;/script&gt; &lt;script src="/Scripts/MicrosoftMvcAjax.js" type="text/javascript"&gt;&lt;/script&gt; &lt;script src="/Scripts/jquery.validate.min.js" type="text/javascript"&gt;&lt;/script&gt; &lt;script src="/Scripts/jquery.validate.unobtrusive.min.js" type="text/javascript"&gt;&lt;/script&gt; &lt;h2&gt;Details&lt;/h2&gt; &lt;p&gt; &lt;a href="/Experience/Edit/1"&gt;Edit&lt;/a&gt; | &lt;a href="/Experience"&gt;Back to List&lt;/a&gt; &lt;/p&gt; &lt;fieldset&gt; &lt;legend&gt;ExperienceModel&lt;/legend&gt; &lt;div class="display-field"&gt; &lt;h2&gt; First Exp &lt;/h2&gt; &lt;/div&gt; &lt;div class="display-field"&gt; hsdh asfhasjfkl fidsjfkldsj fkl dklds lfjdslfj sdsfhkjhdsf ahdfklhs fdsfhklds fldshfklsd fdskfhklds fkjds fhdskfhs fds fkfhkjds ffhsdk &lt;/div&gt; &lt;div class="display-field"&gt; &lt;b&gt;Created By:&lt;/b&gt; xxxxxxx &lt;/div&gt; &lt;div class="display-field"&gt; &lt;b&gt;Create Date:&lt;/b&gt; 1/1/2010 &lt;/div&gt; &lt;div class="display-field"&gt; &lt;b&gt;Modified By:&lt;/b&gt; abcdefg &lt;/div&gt; &lt;div class="display-field"&gt; &lt;b&gt;Modified Date:&lt;/b&gt; 1/5/2010 &lt;/div&gt; &lt;/fieldset&gt; &lt;div id="ShowAllComments"&gt; &lt;table&gt; &lt;tr&gt; &lt;th&gt; Description &lt;/th&gt; &lt;th&gt; CreatedBy &lt;/th&gt; &lt;th&gt; CreateDate &lt;/th&gt; &lt;/tr&gt; &lt;/table&gt; &lt;form action="/Experience/StoreComments/0" data-ajax="true" data-ajax-confirm="Are you sure you want to save your comments" data-ajax-method="POST" data-ajax-mode="replace" data-ajax-update="#ShowAllComments" id="ajaxForm" method="post"&gt; &lt;fieldset&gt; &lt;div class="editor-field"&gt; &lt;label for="comment_Description"&gt;Description&lt;/label&gt;&lt;/div&gt; &lt;div class="editor-field"&gt; &lt;textarea class="text-box multi-line" data-val="true" data-val-required="The Description field is required." id="comment_Description" name="comment.Description"&gt; &lt;/textarea&gt; &lt;span class="field-validation-valid" data-valmsg-for="comment.Description" data-valmsg-replace="true"&gt;&lt;/span&gt; &lt;/div&gt; &lt;/fieldset&gt; &lt;input type="submit" value="Save" /&gt; &lt;/form&gt; &lt;/div&gt; &lt;/div&gt; &lt;div id="footer"&gt; &lt;/div&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>I dont see any javascript error on the page. I did use the IE debugger tool to check if MicrosoftAjax.js and MicrosoftMvcAjax.js are getting loaded, and they do.</p> <p>Any help would be highly appriciated</p> <p>My Web.Config in Views Folder: </p> <pre><code>&lt;configuration&gt; &lt;configSections&gt; &lt;sectionGroup name="system.web.webPages.razor" type="System.Web.WebPages.Razor.Configuration.RazorWebSectionGroup, System.Web.WebPages.Razor, Version=1.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"&gt; &lt;section name="host" type="System.Web.WebPages.Razor.Configuration.HostSection, System.Web.WebPages.Razor, Version=1.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" requirePermission="false" /&gt; &lt;section name="pages" type="System.Web.WebPages.Razor.Configuration.RazorPagesSection, System.Web.WebPages.Razor, Version=1.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" requirePermission="false" /&gt; &lt;/sectionGroup&gt; &lt;/configSections&gt; &lt;system.web.webPages.razor&gt; &lt;host factoryType="System.Web.Mvc.MvcWebRazorHostFactory, System.Web.Mvc, Version=3.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" /&gt; &lt;pages pageBaseType="System.Web.Mvc.WebViewPage"&gt; &lt;namespaces&gt; &lt;add namespace="System.Web.Mvc" /&gt; &lt;add namespace="System.Web.Mvc.Ajax" /&gt; &lt;add namespace="System.Web.Mvc.Html" /&gt; &lt;add namespace="System.Web.Routing" /&gt; &lt;add namespace="GenericApp.Infrastructure" /&gt; &lt;add namespace="GenericApp.Extensions"/&gt; &lt;/namespaces&gt; &lt;/pages&gt; &lt;/system.web.webPages.razor&gt; &lt;appSettings&gt; &lt;add key="webpages:Enabled" value="false" /&gt; &lt;add key="UnobtrusiveJavaScriptEnabled" value="true"/&gt; &lt;/appSettings&gt; &lt;system.web&gt; &lt;httpHandlers&gt; &lt;add path="*" verb="*" type="System.Web.HttpNotFoundHandler"/&gt; &lt;/httpHandlers&gt; &lt;!-- Enabling request validation in view pages would cause validation to occur after the input has already been processed by the controller. By default MVC performs request validation before a controller processes the input. To change this behavior apply the ValidateInputAttribute to a controller or action. --&gt; &lt;pages validateRequest="false" pageParserFilterType="System.Web.Mvc.ViewTypeParserFilter, System.Web.Mvc, Version=3.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" pageBaseType="System.Web.Mvc.ViewPage, System.Web.Mvc, Version=3.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" userControlBaseType="System.Web.Mvc.ViewUserControl, System.Web.Mvc, Version=3.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"&gt; &lt;controls&gt; &lt;add assembly="System.Web.Mvc, Version=3.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" namespace="System.Web.Mvc" tagPrefix="mvc" /&gt; &lt;/controls&gt; &lt;/pages&gt; &lt;/system.web&gt; &lt;system.webServer&gt; &lt;validation validateIntegratedModeConfiguration="false" /&gt; &lt;handlers&gt; &lt;remove name="BlockViewHandler"/&gt; &lt;add name="BlockViewHandler" path="*" verb="*" preCondition="integratedMode" type="System.Web.HttpNotFoundHandler" /&gt; &lt;/handlers&gt; &lt;/system.webServer&gt; &lt;/configuration&gt; </code></pre> <p>Hope i have put all the information out here. </p>
 

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