Master-Detail Sample Code for MVC 3 Razor (using Ajax for details) - Part 2
I am currently showing a treeview in a left column. When a user selects a node, i am loading the right column #details with the response from an ajax call. This works nicely.
I now want to submit the right columns #details via ajax as well. I am able to capture the post back to the server however when i return a string back to the #details section it is loading the entire page with string 'saved successfully'
I really want the string 'saved successfully' to be placed in a div element in the right column.
This is an ajax response, again doing another ajax response (which i want to return to the first ajax response).
Is this possible?
My edit form looks like the following
@using (Ajax.BeginForm("Edit", new AjaxOptions { UpdateTargetId = "#results" })) {
@Html.ValidationSummary(true)
if (Model != null) {
<fieldset>
<legend>Code</legend>
@Html.HiddenFor(model => model.CodeID)
<div class="editor-label">
@Html.LabelFor(model => model.Description)
</div>
<div class="e开发者_Python百科ditor-field">
@Html.EditorFor(model => model.Description)
@Html.ValidationMessageFor(model => model.Description)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Note)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Note)
@Html.ValidationMessageFor(model => model.Note)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.DateModified)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.DateModified)
@Html.ValidationMessageFor(model => model.DateModified)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.TopicID)
</div>
<div class="editor-field">
@Html.DropDownListFor(model => model.TopicID, (SelectList)ViewData["Topics"], "Select")
@Html.ValidationMessageFor(model => model.TopicID)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Special)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Special)
@Html.ValidationMessageFor(model => model.Special)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Html)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Html)
@Html.ValidationMessageFor(model => model.Html)
</div>
<p>
<input type="submit" value="Save" />
</p>
</fieldset>
}
}
<div>
@Html.ActionLink("Back to List", "Index")
</div>
<div id="results">
Status
</div>
Make sure you have included the following script to your page if you want to use the Ajax.*
helpers:
<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script>
If you don't include it there is nothing out there to make sense of the HTML5 data-* attributes emitted by the Ajax.* helper and AJAXify this form => the form performs a normal submit and renders the results.
精彩评论