ASP.Net MVC 3 Jquery UIダイアログフォーム

私は、ユーザーがフォームに記入するためのポップアップダイアログを作成しようとしています。 投稿をクリックすると、フォームを送信します。 モーダルポップアップを作成する方法を理解しましたが、フォームがクリックされたときにフォームを送信する方法を理解できません。誰もこれを行う方法を知っていますか?

@using (Html.BeginForm())
{
    <div>
        
Account Information <div class="editor-label"> @Html.LabelFor(m => m.UserName) </div> <div class="editor-field"> @Html.TextBoxFor(m => m.UserName) @Html.ValidationMessageFor(m => m.UserName) </div> <div class="editor-label"> @Html.LabelFor(m => m.Password) </div> <div class="editor-field"> @Html.PasswordFor(m => m.Password) @Html.ValidationMessageFor(m => m.Password) </div> <div class="editor-label"> @Html.CheckBoxFor(m => m.RememberMe) @Html.LabelFor(m => m.RememberMe) </div>

<input type="submit" value="Log On" />

</div> } <script type="text/javascript"> $(document).ready(function() { $("#dialog-form").dialog({ modal: true, buttons: { "Submit": function() { $(this).dialog("close"); }, Cancel: function() { $(this).dialog("close"); } } }); }); </script>
9

1 答え

フォームに提出するために、コントローラに有効なPOSTメソッドがあることを確認する必要があります。ダイアログの送信ボタンがフォームを送信することを期待していない限り、ここのフォームは有効です。そうであれば、フォームにIDを与え、ダイアログの "Submit"ボタンのために関数からsubmitを呼び出す必要があります。

<div id="dialog-form">
@using (Html.BeginForm("LogOn", "Account", FormMethod.Post, new { id = "LogOnForm" })) {
    <div>
        
Account Information <div class="editor-label"> @Html.LabelFor(m => m.UserName) </div> <div class="editor-field"> @Html.TextBoxFor(m => m.UserName) @Html.ValidationMessageFor(m => m.UserName) </div> <div class="editor-label"> @Html.LabelFor(m => m.Password) </div> <div class="editor-field"> @Html.PasswordFor(m => m.Password) @Html.ValidationMessageFor(m => m.Password) </div> <div class="editor-label"> @Html.CheckBoxFor(m => m.RememberMe) @Html.LabelFor(m => m.RememberMe) </div>

<input type="submit" value="Log On" style="display:none;" />

</div> } </div> <script type="text/javascript"> $(document).ready(function() { $("#dialog-form").dialog({ modal: true, buttons: { "Submit": function() { $("#LogOnForm").submit(); }, Cancel: function() { $(this).dialog("close"); } } }); }); </script>
9
追加された
素晴らしい作品です。私が理解できなかったことは、HTMLヘルパーにIDを生成させることができるということです。私はそのメソッドを使用すると、あなたはHTMLタグに生成されているものに何でもしたいだけダンプすることができますか?
追加された 著者 w.donahue,
うん、有効なHTML属性であれば大丈夫です。
追加された 著者 ptfaulkner,