Моего Вопрос похож на thisMvc Модальных Ajax Форма
То, что я хочу добиться того, чтобы отобразить диалоговое окно, содержащее форму для простого ввода. Как и количество статьи, когда пользователь попадает в submit, все диалоговое окно должно закрывать и отправлять данные без перезагрузки всей страницы.
Это Частичный вид загружается форма:
@model TRUNCATED.Models.AddToCartModel
<script src="~/Scripts/jquery-1.7.1.min.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>
@using (Html.BeginForm("AddToCart", "Order", new AjaxOptions { // DO I NEED ANY? }))
{
<fieldset>
<legend>AddToCartModel</legend>
<img src="@Url.Action("GetImage", "File", new { ArticleId = Model.ArticleId })" title="Artikelbild" style="resize:both; width: 300px; height:200px;" />
<div class="editor-label">
@Html.LabelFor(model => model.ArticleId)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.ArticleId)
@Html.ValidationMessageFor(model => model.ArticleId)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Quantity)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Quantity)
@Html.ValidationMessageFor(model => model.Quantity)
</div>
<p>
<input type="submit" value="Add to Cart" />
</p>
</fieldset>
}
Это диалог ЯШ:
$("#dialog").dialog({
autoOpen: false,
resizeable: false,
width: 350,
height: 600,
modal: true,
show: {
effect: "blind",
duration: 300
},
hide: {
effect: "blind",
duration: 300
},
buttons: {
"Close": function() {
$(this).dialog("close");
}
}
});
$(".showDialog").on("click", function (e) {
$('#dialog').load(this.href).dialog('open');
return false;
});
Это, как я открыть диалоговое окно:
@Html.ActionLink("Add to Cart", "AddToCart",
new { id =item.ArticleId},
new { @class = "showDialog" }
В контроллер:
[HttpGet]
public ActionResult AddToCart(int id)
{
return PartialView("_AddToCart", new AddToCartModel() { ArticleId = id });
}
[HttpPost]
public ActionResult AddToCart(AddToCartModel atm)
{
if (OrderData.CartItems.Count > 0)
atm.Pos = OrderData.CartItems.Max(i => i.Pos) + 1;
else
atm.Pos = 1;
OrderData.CartItems.Add(atm);
return // What goes here?
}
Im новое к этому, и я понятия не имею, что я делаю неправильно здесь. Я заменил Hml. с Ajax. но это ничего не изменило.
Он работает, хотя он перезагружает всю страницу, которая имеет такие побочные эффекты, как Webgrid, устанавливает одно назад, а что нет.
Дает мне пустую страницу с сообщением «ПУНКТ ДОБАВЛЕН В КОРЗИНУ», что означает, что данные не загружаются в div targetID. – CSharpie
Это не аякс. Вы используете форму Ajax? Все сценарии добавлены для этого на странице? – maxs87
Вам нужна ссылка jquery.unobtrusive-ajax.min.js на странице. – maxs87