ありふれた「編集」ビューでビューモデルを使用して表示されるドメイン集計があります。ルートオブジェクトはです。これには、タイプがClient
ネストされたプロパティがあります。リファラーの姓名はクライアント編集ビューに表示されますが、リファラーの連絡先がまだシステムにない場合は、ユーザーが[連絡先の作成]ダイアログを表示できるようにする必要があります。Contactオブジェクトの部分ビューを使用してjQueryダイアログでこれを実行しようとしています。問題は、[連絡先の作成]ダイアログを生成するボタンをオブジェクトのフィールドセット内に配置すると、ダイアログが機能しないことです。簡略化されたコード:Referrer
Contact
Client
かみそり:
@using(Html.BeginForm()){
@Html.ValidationSummary(true)
<fieldset>
<table>
<tr>
<td>
Client Name:
@Html.TextBoxFor(m => m.ClientName)
</td>
<td>
Referred By:
@Html.TextBoxFor(m => m.ReferrerName)
<button id="createContact">New...</button>
</td>
</tr>
</table>
<div class="lower-right-button">
<input type="submit" value="Save" />
</div>
</fieldset>
}
<div id="createContactDialog" title="Create Contact" style="overflow: hidden;"></div>
jQuery:
$(document).ready(function() {
$("#createContactDialog").dialog({
autoOpen: false,
resizable: false,
width: 400,
title: "Create Contact",
modal: true,
open: function(event, ui){
$(this).load("@Url.Action("CreateContactPartial", "Contact")");
},
buttons: {
"Cancel": function() {
$(this).dialog("close");
}
}
});
$("#createContact")
.button()
.click(function() {
$("#createContactDialog").dialog("open");
});
});
ボタンをcreateContact
スコープから外すとHtml.BeginForm
、ダイアログは正しく表示されますが、ボタンは必要な場所の近くに配置されていません。上記の例のようにボタンをそのままにしておくと、ダイアログが1秒間表示されてから、閉じます。内に「連絡先の作成」ダイアログを起動するボタンを表示する方法はありますHtml.BeginForm
か?そうでない場合は、DOMからがらくたをハックすることなく、ボタンを希望の場所に配置するための他のオプションはありますか?