ASP.Net MVC 3 Jquery Formulario de diálogo UI

Question

Estoy tratando de hacer un cuadro de diálogo emergente para permitir al usuario completar un formulario. Cuando hacen clic en enviar, quiero enviar el formulario. Descubrí cómo hacer que el menú emergente modal no pueda encontrar la forma de hacerlo enviar el formulario cuando se hace clic en el formulario. ¿Alguien sabe como hacer esto?

@using (Html.BeginForm()) 
{ 
    <div> 
     <fieldset> 
      <legend>Account Information</legend> 

      <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> 

      <p> 
       <input type="submit" value="Log On" /> 
      </p> 
     </fieldset> 
    </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> 

Answer 1

Debe asegurarse de tener un método POST válido en su controlador para enviar el formulario. Su formulario aquí parece válido siempre que no espere que el botón de enviar del diálogo envíe el formulario. Si ese es el caso, entonces deberá dar al formulario una identificación y llamar a enviar desde su función para el botón de diálogo "Enviar".

<div id="dialog-form"> 
@using (Html.BeginForm("LogOn", "Account", FormMethod.Post, new { id = "LogOnForm" })) { 
    <div> 
     <fieldset> 
      <legend>Account Information</legend> 

      <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> 

      <p> 
       <input type="submit" value="Log On" style="display:none;" /> 
      </p> 
     </fieldset> 
    </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>