#ajax #asp.net-mvc #asp.net-mvc-3 #razor #partial-views
#ajax #asp.net-mvc #asp.net-mvc-3 #razor #частичные представления
Вопрос:
ИСПРАВЛЕНО, НО ТА ЖЕ ПРОБЛЕМА:
Я создаю сайт с помощью MVC 3 и столкнулся с большим препятствием. На странице профиля пользователи смогут создать новый список, предлагаемый их центром. Я создал это, используя частичное представление для части страницы «_CenterProfile», которая работает отлично. Я реализовал функцию создания списка в качестве основного фокуса страницы и модели, которая также отлично работает. Я хотел бы использовать Ajax для создания записей базы данных, а также для заполнения или обновления списков, отображаемых на странице профиля. Вот тут-то и возникает проблема.
Когда я нажимаю кнопку отправки, вместо обновления целевого элемента страница переходит на несуществующую страницу «CreateListing» ../Exchange / CreateListing. Я схожу с ума, пытаясь заставить это функционировать, и независимо от того, что я пытаюсь, это делает то же самое. Список заполняется в базу данных, и страница изменяется с /Exchange/Profile на /Exchange/CreateListing .
Я уверен, что кто-нибудь может мне помочь, у меня крайний срок, и преодоление этой головной боли сэкономит мне много времени.
Вид «Профиль»:
@model Exchange.Models.CreateListingModel
@{
ViewBag.Title = "Profile";
}
<h2>Profile</h2>
@Html.Action("_CenterProfile")
<br />
@using (Ajax.BeginForm("CreateListing", "Exchange", new AjaxOptions
{
HttpMethod = "Get",
UpdateTargetId = "centerListings",
InsertionMode = InsertionMode.Replace
}))
{
@Html.ValidationSummary(true)
<fieldset>
<legend>CreateListingModel</legend>
<div class="editor-label">
@Html.LabelFor(model => model.productName)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.productName)
@Html.ValidationMessageFor(model => model.productName)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.forSale)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.forSale)
@Html.ValidationMessageFor(model => model.forSale)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.forTrade)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.forTrade)
@Html.ValidationMessageFor(model => model.forTrade)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.price)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.price)
@Html.ValidationMessageFor(model => model.price)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.unit)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.unit)
@Html.ValidationMessageFor(model => model.unit)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.catagoryID)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.catagoryID)
@Html.ValidationMessageFor(model => model.catagoryID)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.description)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.description)
@Html.ValidationMessageFor(model => model.description)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.imageURL)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.imageURL)
@Html.ValidationMessageFor(model => model.imageURL)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.activeListing)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.activeListing)
@Html.ValidationMessageFor(model => model.activeListing)
</div>
</fieldset>
<p>
<input type="submit" value="CreateListing" />
</p>
}
<table id="centerListings">
</table>
<p>
@Html.ActionLink("Edit", "Edit", new { /* id=Model.PrimaryKey */ }) |
@Html.ActionLink("Back to List", "Index")
</p>
Создайте контроллер списка:
public PartialViewResult CreateListing(CreateListingModel model)
{
mmjc.CreateListing(model.catagoryID, model.productName, model.forSale, model.forTrade, model.price, model.unit, model.description, model.imageURL, model.activeListing);
var listings = mmjc.GetCenterListings();
return PartialView("_CenterListings", listings);
}
_CenterListings Частичный просмотр:
@model IEnumerable<Exchange.Models.Listing>
<table id="centerListings">
<tr>
<th>
CatagoryID
</th>
<th>
ProductName
</th>
<th>
ToSell
</th>
<th>
ToTrade
</th>
<th>
PricePerUnit
</th>
<th>
Unit
</th>
<th>
Description
</th>
<th>
ImgPath
</th>
<th>
ProfileID
</th>
<th>
ActiveListing
</th>
<th></th>
</tr>
@foreach (var item in Model) {
<tr>
<td>
@Html.DisplayFor(modelItem => item.CatagoryID)
</td>
<td>
@Html.DisplayFor(modelItem => item.ProductName)
</td>
<td>
@Html.DisplayFor(modelItem => item.ToSell)
</td>
<td>
@Html.DisplayFor(modelItem => item.ToTrade)
</td>
<td>
@Html.DisplayFor(modelItem => item.PricePerUnit)
</td>
<td>
@Html.DisplayFor(modelItem => item.Unit)
</td>
<td>
@Html.DisplayFor(modelItem => item.Description)
</td>
<td>
@Html.DisplayFor(modelItem => item.ImgPath)
</td>
<td>
@Html.DisplayFor(modelItem => item.ProfileID)
</td>
<td>
@Html.DisplayFor(modelItem => item.ActiveListing)
</td>
<td>
@Html.ActionLink("Edit", "Edit", new { id=item.ListingsID }) |
@Html.ActionLink("Details", "Details", new { id=item.ListingsID }) |
@Html.ActionLink("Delete", "Delete", new { id=item.ListingsID })
</td>
</tr>
}
</table>
Ответ №1:
Я думаю, вам следует указать UpdateTargetId
в своем AjaxOptions
:
new AjaxOptions { HttpMethod = "Post",
UpdateTargetId = "idOfSomeHtmlContainer" }
С помощью этого свойства вы указываете, какая часть страницы должна быть обновлена с помощью ответа от вызова AJAX. Используя код, который у вас есть сейчас, ASP.NET MVC не знает, какую часть страницы обновлять с помощью представления, возвращаемого вашим методом действия.
Комментарии:
1. Даже используя UpdateTargetId, я не могу получить правильные результаты. Форма явно публикует сообщения с использованием Ajax, но вместо обновления моей недавно созданной и идентифицированной таблицы она приводит меня к общему частичному представлению, которого даже не существует. Это в конечном итоге расстраивает.
2. Что вы подразумеваете под «общим частичным представлением, которого не существует»? Если возможно, попробуйте посмотреть, что именно отправляется на сервер и что возвращается (с помощью инструментов разработчика Chrome / IE / Firefox или Fiddler). Обычно это очень помогает при создании асинхронных веб-приложений.
Ответ №2:
Все в порядке. Итак, я исправил свою собственную проблему здесь. Кажется, у многих людей возникает такая же проблема. Исправление настолько простое, что я почувствовал себя очень глупо.
Все, что вам нужно сделать, это включить
<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script>
В вашем _Layout или главном представлении. Без этого Ajax.BeginForm бесполезен и будет продолжать перенаправлять на PartialViewResult.
Ответ №3:
Я думаю, вы хотите указать необходимые параметры Ajax для замены содержимого формы создания списка, а именно идентификатор заменяемого элемента и режим обновления.