ポップアップの部分ビューを使用してすべての CRUD トランザクションを処理する MVC Web サイトを作成しています。私のアプリケーションは既にこれらの CRUD 操作を完全に処理できることに注意してください (LINQ-To-Entity)。ただし、ポップアップ フォームに問題があります。
以下は私のコードです_Add.cshtml
:
@model MyStore.Models.MyModels.ProductsModel
@{
Layout = null;
}
@using (Ajax.BeginForm("_Add", "Products", new AjaxOptions
{
InsertionMode = InsertionMode.Replace,
HttpMethod = "POST",
OnSuccess = "addSuccess"
}, new { @id = "addForm" }))
{
@Html.ValidationSummary(true)
<div id="add-message" class="error invisible"></div>
<fieldset>
<legend>Products</legend>
@Html.HiddenFor(m => Model.ProductCode)
<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.Price)
</div>
<div class="editor-field">
@Html.TextBoxFor(model => model.Price)
@Html.ValidationMessageFor(model => model.Price)
</div>
</fieldset>
}
以下は私のコードですController
:
[HttpGet]
public ActionResult _Add(string productCode)
{
ProductsModel model = newProductsModel();
model.ProductCode = ProductCode ;
return PartialView(model);
}
[HttpPost]
public JsonResult _Add(ProductsModel model)
{
if (ModelState.IsValid)
{
ProductsManager prod = new ProductsManager();
Products pa = new Products();
pa.ProductCode = model.ProductCode;
pa.ProductName = model.ProductName;
pa.Price = model.Price;
prod.AddProduct(pa);
return Json(HelperClass.SuccessResponse(pa), JsonRequestBehavior.AllowGet);
}
else
{
return Json(HelperClass.ErrorResponse("Please review your form"), JsonRequestBehavior.DenyGet);
}
}
_Add.cshtml
これは、インターネットで見つけた Popup.js を介してレンダリングされている部分的なビューであることに注意してください。次のコードでレンダリングされます。
@Html.ActionLink("[Add Product]", "_Add", new { ProductCode = @ViewData["ProductCode"] }, new { @class = "editLink" })
これは問題なく動作します。つまり、データベースに製品を追加します。しかし、私の問題はProceed
ボタンをクリックしたときです。ページからこのポップアップダウンロードダイアログが表示されます。
誰かがこれで私を助けてくれますか? 私がHttpMethod
使用している(POST、PUT、GET、DELETE)ためだと思いますが、どちらを使用するのが正しいのか、そもそもそれが本当に問題なのかはよくわかりません。
どんな助けでも大歓迎です!PS。長い投稿で申し訳ありません。
編集:
これは、このプロジェクトで従ったチュートリアルです: http://ricardocovo.com/2012/04/06/asp-mvc3-editing-records-with-jqueryui-dialogs-and-ajaxforms-razor-version/
編集:
以下は、私が使用しているjscriptコードです。基本的には、私が従ったチュートリアルと同じです。最後のメソッドの数行をコメントアウトする必要がありました。
また、私は MVC 4 を使用しています。ありがとう!
var linkObj;
$(function () {
$(".addLink").button();
$('#addDialog').dialog({
autoOpen: false,
width: 400,
resizable: false,
modal: true,
buttons: {
"Update": function () {
$("#add-message").html(''); //make sure there is nothing on the message before we continue
$("#addForm").submit();
},
"Cancel": function () {
$(this).dialog("close");
}
}
});
$(".addLink").click(function () {
//change the title of the dialog
linkObj = $(this);
var dialogDiv = $('#addDialog');
var viewUrl = linkObj.attr('href');
$.get(viewUrl, function (data) {
dialogDiv.html(data);
//validation
var $form = $("#addForm");
// Unbind existing validation
$form.unbind();
$form.data("validator", null);
// Check document for changes
//$.validator.unobtrusive.parse(document);
// Re add validation with changes
//$form.validate($form.data("unobtrusiveValidation").options);
//open dialog
dialogDiv.dialog('open');
});
return false;
});
});
function addSuccess(data) {
if (data.Success == true) {
//we update the table's info
//var parent = linkObj.closest("tr");
//parent.find(".carName").html(data.Object.Name);
//parent.find(".carDescription").html(data.Object.Description);
//now we can close the dialog
$('#addDialog').dialog('close');
//twitter type notification
$('#commonMessage').html("Add Complete");
$('#commonMessage').delay(400).slideDown(400).delay(3000).slideUp(400);
}
else {
$("#add-message").html(data.ErrorMessage);
$("#add-message").show();
}
}
次の 2 行をコメントアウトしました。
$.validator.unobtrusive.parse(document);
$form.validate($form.data("unobtrusiveValidation").options);
それらにコメントしないと、実行時に以下のエラーが発生するためです。
これは、この問題が目立たない検証によるものであるという意見につながります。以下の Xnake によって投稿されたリンクのように、私は同じ種類の問題を抱えています。唯一の違いは、Thread Opener が Web.config ファイルで目立たない検証を無効にして問題を解決しなければならなかったことですが、私のコードは目立たない検証を使用しているため、同じことはできません。
ここで何か助けていただければ幸いです。どうもありがとうございました!