Dan Miser - Why AJAX posts go to a new page instead of updating UpdateTargetId

Sunday, May 31, 2009

Why AJAX posts go to a new page instead of updating UpdateTargetId

Given a set up like this (where ExpenseSummaryData returns some arbitrary HTML fragment) :


<%using (Ajax.BeginForm("ExpenseSummaryData", new AjaxOptions { UpdateTargetId = "result" })) { %>
    <label for="startDate">Start Date:</label>
    <%= Html.TextBox("startDate") %>
    <br />
    <label for="endDate">End Date:</label>
    <%= Html.TextBox("endDate")%>
    <br />
    <input type="submit"/>
    <br />
    <span id="result"/>
<% } %>

If that is all your page does, you will notice that you get taken to a new page when pressing Submit. The data on the new page is the HTML fragment returned by the AJAX call, but that's all it contains (e.g. no master page), and it's clearly not replacing the result span.

The reason for this is that I forgot to add the following lines to the <head> section in the original page:


    <script src='<%=ResolveUrl("~/Content/js/MicrosoftAjax.debug.js")%>' type="text/javascript"></script>
    <script src='<%=ResolveUrl("~/Content/js/MicrosoftMvcAjax.debug.js")%>' type="text/javascript"></script>

After adding those declarations in, the content in the span tag is properly updated and it looks like a real AJAX call.

Sunday, May 31, 2009 10:38:24 AM (Central Standard Time, UTC-06:00)

Comments [0] -
.NET | ASP.NET MVC

Comments are closed.