3

ありふれた「編集」ビューでビューモデルを使用して表示されるドメイン集計があります。ルートオブジェクトはです。これには、タイプがClientネストされたプロパティがあります。リファラーの姓名はクライアント編集ビューに表示されますが、リファラーの連絡先がまだシステムにない場合は、ユーザーが[連絡先の作成]ダイアログを表示できるようにする必要があります。Contactオブジェクトの部分ビューを使用してjQueryダイアログでこれを実行しようとしています。問題は、[連絡先の作成]ダイアログを生成するボタンをオブジェクトのフィールドセット内に配置すると、ダイアログが機能しないことです。簡略化されたコード:ReferrerContactClient

かみそり:

@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からがらくたをハックすることなく、ボタンを希望の場所に配置するための他のオプションはありますか?

4

1 に答える 1

4

The button event is causing the form to disappear. Change the click function to prevent that.

 $("#createContact")
        .button()
        .click(function (e) {
            $("#createContactDialog").dialog("open");
            e.preventDefault();
        }); 
于 2012-05-17T15:37:42.543 に答える