#ajax #asp.net-mvc-3 #form-submit
#ajax #asp.net-mvc-3 #форма-отправка
Вопрос:
Я хочу добавлять и удалять локализованные имена для объекта country через ajax. Поэтому я построил два частичных представления. Первая содержит общую функцию редактирования для объекта country, а второе частичное представление (которое будет отображаться внутри первого) содержит логику для добавления / удаления локализованных имен.
1-й частичный просмотр:
@model CountryViewModel
// scripts here
@using (Html.BeginForm()) {
@Html.ValidationSummary(true)
<fieldset>
[...] // the fields of the object to edit...
</fieldset>
}
// this tag will be updated by the partial view
<div id="localizedNamesOverview">
@Html.Partial( "LocalizedNamesOverview",
Model.LocalizedNames,
new ViewDataDictionary
{
{ "countryId", Model.CountryId }
} )
</div>
2-й частичный просмотр:
@model IEnumerable<LocalizedNameViewModel>
<table>
@foreach (var item in Model)
{
<tr>
<td> @item.Language </td>
<td> @item.Name </td>
<td>
@Ajax.ActionLink( "Delete",
"DeleteLocalizedName",
"Country",
new { countryId = this.ViewData[ "countryId" ],
localizedNameId = item.CountryI18nId },
new AjaxOptions
{
UpdateTargetId="localizedNamesOverview",
InsertionMode=InsertionMode.Replace,
HttpMethod="POST"
} )
</td>
</tr>
}
@using( Ajax.BeginForm( "AddLocalizedName",
"Country",
new { countryId = this.ViewData[ "countryId" ] },
new AjaxOptions
{
UpdateTargetId = "localizedNamesOverview",
InsertionMode = InsertionMode.Replace,
HttpMethod = "POST"
} ) )
{
<tr>
<td> <input class="text-box single-line" id="LanguageId" name="LanguageId" value="" type="text" /> </td>
<td> <input class="text-box single-line" id="Name" name="Name" value="" type="text" /> </td>
<td> <input type="submit" value="Add new localized name" /> </td>
</tr>
}
</table>
Выделенный контроллер возвращает 2-е частичное представление при добавлении или удалении локализованного имени и заменяет себя, добавляя содержимое в localizedNamesOverview из 1-го представления. Пока это работает так, как я ожидал.
Проблема сейчас в том, что это поведение работает только один раз. Если я успешно добавил или удалил имя, я не могу удалить / добавить второе. На данный момент я не вижу, в чем проблема, потому что сгенерированный html выглядит равным после первой отправки.
Любая помощь приветствуется.
Спасибо
Ответ №1:
Хорошо, я понял, в чем проблема:
Когда выполняется первый запрос и повторно отображается 2-й частичный вид, он теряет информацию ViewData ( countryId
) от родительского элемента, которая необходима для создания рабочих ссылок (delete-link для каждого существующего локализованного имени).
Та же проблема относится и к исходной ajax-форме, которая также теряет идентификатор. С помощью некоторого изменения положения кода я мог бы решить проблему. Я поместил @using( Ajax.BeginForm...
код из 2-го частичного представления в родительское представление, поэтому он не будет восстановлен после ajax-запроса.
1-й частичный просмотр (обновленный):
@using( Ajax.BeginForm( "AddLocalizedName",
"Country",
new { countryId = this.ViewData[ "countryId" ] },
new AjaxOptions
{
UpdateTargetId = "localizedNamesOverview",
InsertionMode = InsertionMode.Replace,
HttpMethod = "POST"
} ) )
{
// this tag will be updated by the partial view
<div id="localizedNamesOverview">
@Html.Partial( "LocalizedNamesOverview",
Model.LocalizedNames,
new ViewDataDictionary
{
{ "countryId", Model.CountryId }
} )
</div>
}
Проблема с удалением ссылок может быть решена, потому что моя модель LocalizedNameViewModel
также содержит выделенную countryId
, и поэтому я беру ее оттуда.
2-й частичный просмотр (обновленный):
@Ajax.ActionLink( "Delete",
"DeleteLocalizedName",
"Country",
new { countryId = item.CountryId, // took countryId from the model
localizedNameId = item.CountryI18nId },
new AjaxOptions
{
UpdateTargetId="localizedNamesOverview",
InsertionMode=InsertionMode.Replace,
HttpMethod="POST"
} )