Ajax.BeginForm の操作方法とコントローラーとのやり取りがよくわかりません。これが私の状況です。アイテムのリストを含むページがあります。アイテムの横にある [編集] をクリックすると、jquery ダイアログ ボックスが開き、編集するフィールドを含む厳密に型指定された部分ビューが表示されます。[更新] をクリックすると、ビューモデルが有効な場合は変更を保存するか、必要に応じてエラーを表示します。私の問題は、[更新] をクリックしたときです。シリアル化されたデータをビューモデルとしてコントローラーに送信できるところまで到達できません。
編集：わかりました、1つの問題が見つかりました。フォーム タグが適切に形成されていなかったため、フォーム フィールドがフォームの外側にありました。今、フォームのシリアル化に問題があります。次のメッセージが表示されます: 無効な JSON プリミティブ: section_id。
ここに私のシリアル化された文字列があります:
section_id=74§ion_name_en=The+CF+Mission§ion_name_fr=La+mission+des+FC&norm_tab_name_en=紹介&norm_tab_name_fr=紹介§ion_tab_id=2&active=true&active=false&display_order=100&banner=banner.jpg&tab_title_en=紹介&tab_title_fr=紹介&content_id=17&%2B6%b%3%3%Csp%3%3Csp%3%Csp %2Fdiv%3E%0D%0A%0D%0A%3Cdiv%3E%3Cstrong%3EThe+mission+of+the+Canadian+Forces+is+to%3A%3C%2Fstrong%3E%3C%2Fdiv%3E%0D %0A%0D%0A%3Cul+style%3D%22list-style-type%3A+disc%22%3E%0D%0A%09%3Cli%3Eprotect+Canada%2C%3C%2Fli%3E%0D%0A %09%3Cli%3Edefend+North+America+in+co+operation+with+US%2C+and%3C%2Fli%3E%0D%0A%09%3Cli%3Econtribute+to+international+peace+and +セキュリティ。%3C%2Fli%3E%0D%0A%3C%2Ful%3E%0D%0A%0D%0A%3Cdiv%3E%3Cbr+%2F%3E%0D%0AOn+any+given+day%2C+about+8 %2C000+Canadian+Forces+members+-+one+three+of+our+deployable+force+-+are+preparing+for%2C+engaged+in+or+returning+from+an+overseas+mission.+At+ home%2C+Canadian+Forces+can+bring+the+best+available+military+resources+from+across+Canada+to+bear+on+a+crisis+or+threat%2C+wherever+it+occurs% 2C+全国規模.%3Cbr+%2F%3E%0D%0A%3Cbr+%2F%3E%0D%0AThe+Canadian+Forces+now+has+an+agile%2C+high-readiness+Special+Operations+Forces +capable+of+operating+across+the+spectrum+of+conflict+at+home+and+abroad%3B+it+is+comprised+of+Joint+Task+Force+2+(JTF-2)%2C +the+Special+Operations+Aviation+Squadron%2C+the+Joint+Nuclear%2C+Biological+and+Chemical+Defence+Company%2C+and+the+Canadian+Special+Operations+Regiment.%3C%2Fdiv% 3E%0D%0A&content_text_fr=%3Cdiv%3E%26nbsp%3B%3C%2Fdiv%3E%0D%0A%0D%0A%3Cdiv%3E%3Cstrong%3ELa+mission+des+Forces+canadiennes+est+de%3C%2Fstrong%3E %3C%2Fdiv%3E%0D%0A%0D%0A%3Cul%3E%0D%0A%09%3Cli%3Eprot%26eacute%3Bger+le+Canada%2C%3C%2Fli%3E%0D%0A%09 %3Cli%3Ed%26eacute%3Bfendre+l%26%2339%3BAm%26eacute%3Brique+du+Nord+en+collaboration+avec+les+%26Eacute%3Btats-Unis+et%3C%2Fli%3E%0D%0A %09%3Cli%3Ede+favoriser+la+paix+et+la+s%26eacute%3Bcurit%26eacute%3B+dans+le+monde.%3C%2Fli%3E%0D%0A%3C%2Ful%3E% 0D%0A%0D%0A%3Cdiv%3E%3Cbr+%2F%3E%0D%0AChaque+jour%2C+environ+8+000+militaires+des+Forces+canadiennes+(FC)%2C+soit+%26agrave%3B +peu+pr%26egrave%3Bs+le+tiers+de+nos+forces+d%26eacute%3Bployables%2C+se+pr%26eacute%3Bparent+%26agrave%3B+une+mission+%26agrave%3B+l%26 %2339%3B%26eacute%3Btranger%2C+y+参加者+sur+place+ou+en+reviennt.+Au+pays%2C+les+Forces+canadiennes+peuvent+mettre+%26agrave%3B+profit+les+meilleures+ressources+militaires+de+partout+au+Canada%2C+en+cas+de+crise+ou +de+menace%2C+n%26%2339%3Bimporte+o%26ugrave%3B+sur+l%26%2339%3Bensemble+du+territoire.%3Cbr+%2F%3E%0D%0A%3Cbr+%2F%3E%0D%0ALes+Forces+canadiennes+se+sont+dot%26eacute%3Bes+d%26%2339%3Bune+capacit%26eacute%3B+d %26%2339%3Bop%26eacute%3Brations+sp%26eacute%3Bciales+%26eacute%3Blargie+et+am%26eacute%3Blior%26eacute%3Be+capables+d%26%2339%3Bintervenir+rapidement+et+pouvant+mener +des+op%26eacute%3Brations+sur+tout+l%26%2339%3B%26eacute%3Bventail+des+conflits%2C+au+Canada+comme+%26agrave%3B+l%26%2339%3B%26eacute %3Btranger+%3B+ces+forces+comprennent+la+Deuxi%26egrave%3Bme+Force+op%26eacute%3Brationnelle+interarm%26eacute%3Bes+(FOI-2)%2C+l%26%2339%3BEscadron+d% 26%2339%3Bop%26eacute%3Brations+sp%26eacute%3Bciales+(Aviation)%2C+la+Compagnie+interarm%26eacute%3Bes+de+d%26eacute%3Bfense+nucl%26eacute%3Baire%2C+biologique+et +chimique+et+le+R%26eacute%3Bgiment+d%26%2339%3Bop%26eacute%3Brations+sp%26eacute%3Bciales+du+Canada.%3C%2Fdiv%3E%0D%0A%3C%2Fdiv%3E%0D%0A%3C%2Fdiv%3E%0D%0A
ここに私のモデル定義があります:
public class SectionContent
{
private int _section_tab_id;
private int _section_id;
private string _section_name_en;
private string _section_name_fr;
private string _tab_title_en;
private string _tab_title_fr;
private int _display_order;
private string _norm_tab_name_en;
private string _norm_tab_name_fr;
private string _banner;
private bool _active;
private int _content_id;
private string _content_text_en;
private string _content_text_fr;
[snip]
}
ここに私のPartialViewがあります:
<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<ForcesCMS.Models.SectionContent>" %>
<%=Html.ValidationSummary(MyLabels.labels.please_correct_markedfields, new { @class = "validation" })%>
<fieldset>
<legend><%=Model.tab_title_en%></legend>
<input type="hidden" id="section_id" name="section_id" value="<%= Model.section_id%>" />
<input type="hidden" id="section_name_en" name="section_name_en" value="<%= Model.section_name_en%>" />
<input type="hidden" id="section_name_fr" name="section_name_fr" value="<%= Model.section_name_fr%>" />
<input type="hidden" id="norm_tab_name_en" name="norm_tab_name_en" value="<%= Model.norm_tab_name_en%>" />
<input type="hidden" id="norm_tab_name_fr" name="norm_tab_name_fr" value="<%= Model.norm_tab_name_fr%>" />
<input type="hidden" id="content_id" name="content_id" value="<%= Model.content_id%>" />
<div class="formrowFull">
<div class="formcol">
<label for="section_tab_id" class="inline"><%=MyLabels.labels.id%></label>
<%= Html.TextBoxFor(model => model.section_tab_id, new { @class = "smallBoxReadonly" })%>
</div>
<div class="formcol">
<label for="active" class="inline"><%=MyLabels.labels.active%></label>
<%=Html.CheckBoxFor(model => model.active)%>
</div>
</div>
<div class="formrowFull">
<div class="formcol">
<label for="display_order" class="inline mandatory"><%=MyLabels.labels.display_order%></label>
<%= Html.TextBoxFor(model => model.display_order, new { @class = "smallBox" })%>
<%= Html.ValidationMessageFor(model => model.display_order)%>
</div>
<div class="formcol">
<label for="banner" class="inline"><%=MyLabels.labels.banner%></label>
<%= Html.TextBoxFor(model => model.banner, new { @class = "largeBox" })%>
</div>
</div>
<div class="formrowFull">
<div class="formcol">
<label for="tab_title_en" class="mandatory"><%=MyLabels.labels.title_en%></label>
<%= Html.TextBoxFor(model => model.tab_title_en, new { @class = "largeBox" })%>
<%= Html.ValidationMessageFor(model => model.tab_title_en)%>
</div>
<div class="formcol">
<label for="tab_title_fr" class="mandatory"><%=MyLabels.labels.title_fr%></label>
<%= Html.TextBoxFor(model => model.tab_title_fr, new { @class = "largeBox" })%>
<%= Html.ValidationMessageFor(model => model.tab_title_fr)%>
</div>
</div>
<div class="formrowFull">
<div class="formcol">
<input type="hidden" name="content_id" id="content_id" value="<%=Model.content_id %>" />
<%= Html.LabelFor(model => model.content_text_en)%>
<%= Html.TextAreaFor(model => model.content_text_en, new { @class = "ckeditor_tpl" })%>
<%= Html.ValidationMessageFor(model => model.content_text_en)%>
</div>
<div class="formcol">
<%= Html.LabelFor(model => model.content_text_fr)%>
<%= Html.TextAreaFor(model => model.content_text_fr, new { @class = "ckeditor_tpl" })%>
<%= Html.ValidationMessageFor(model => model.content_text_fr)%>
</div>
</div>
</fieldset><%}%>
次にコントローラーとスクリプトを投稿します。これらは私を混乱させる部分です。
コントローラ：
[HttpGet]
// Called when click on Edit link - data displayed in modal dialog
public PartialViewResult AddEditRecord(int id)
{
ViewData["IsUpdate"] = true;
SectionContent sc = ContentHandler.GetTabContent(id);
return PartialView("ContentForm", sc);
}
[HttpPost]
[ValidateInput(false)]
// Called when clicking on Update in modal
public PartialViewResult AddEditRecord(SectionContent sc, string cmd)
{
// Never valid because model (sc) is always null
if (ModelState.IsValid)
{
try
{
//update
int result = ContentHandler.UpdateSectionContent(sc);
return PartialView("ContentForm");
}
catch { }
}
if (Request.IsAjaxRequest())
{
return PartialView("ContentForm", sc);
}
else
{
return PartialView("ContentForm");
}
}
脚本：
$.ajaxSetup({ cache: false });
function DoAjaxUpdate() {
$.ajax({
url: $("#frmEdit").attr("action"),
type: 'POST',
dataType: "json",
contentType: 'application/json',
data: $("#frmEdit").serialize(),
success: function (result) {
$('#dialog-edit').html(result);
}
});
}
$(".editDialog").live("click", function (e) {
var url = $(this).attr('href');
$("#dialog-edit").dialog({
title: 'Edit Tab and Content',
autoOpen: false,
resizable: false,
height: 800,
width: 600,
show: { effect: 'drop', direction: "up" },
modal: true,
draggable: true,
open: function (event, ui) {
$(this).load(url);
},
close: function (event, ui) {
$(this).dialog('close');
},
buttons: {
"Update": function () {
DoAjaxUpdate();
},
"Cancel": function () {
$(this).dialog('close');
}
}
});
$("#dialog-edit").dialog('open');
return false;
});
コントローラーによって有効な ViewModel として認識されるように、フォームを適切にシリアル化するにはどうすればよいですか。それが解決したら、Controller アクションで何をする必要がありますか? JsonResult? PartialView を返しますか? アクション結果?
私はたくさんの SO 投稿や他のサイトを調べてきました。ここ数日間、たくさんのことを試しましたが、うまくいきませんでした。どんな助けでも感謝します。ありがとうございました ！