在提交表单之前在客户端显示对话框

Question

我有一个表单可以自己使用每个输入中的必需属性来确保用户输入一个值。 IE：

<form id="myForm">
    <div class="formcontainer">
        <div class="formText">
            First Name <span class="required">*</span>
        </div>
        <div class="formBox" id="test">
            <input name="firstname" id="firstname" type="text" required />
        </div>
        <div class="formText">
             Last Name <span class="required">*</span>
        </div>
        <div class="formBox"><input name="lastName" type="text" required /></div>
    </div>
    <div class="buttons">
        <div class="formButton" id="submit">
            <asp:Button onclick="btnRequestSampleSubmit" Text="Submit" runat="server" />
        </div>
        <div class="formButton" id="reset">
             <input type="reset" value="Reset" tabindex="8"/>
        </div>
    </div>
</form>

为了节省空间，我在表单中有大约6个其他字段，但是想给你一个想法。当我提交表单时，页面会刷新。除了我想在提交按钮上添加一个.dialog框以便让用户知道表单经过时，所有这些都很精致和花花公子。所以我补充说：

       $('.buttons #submit').on('click', function (e) {
            $('#dialog').dialog({                    
                 position: { my: "center", at: "center", of: window },
           });                
            $('#fade').show();
            return false;            
        });

（#fade）只是一个填充屏幕的不透明度框，所以当用户点击它时，框会关闭，页面会刷新。当我添加底部脚本时，验证工作正常，但如果用户在填写所有内容之前点击进入或点击提交按钮，则表单将被提交，而不会填写其余的输入字段。如果我取出使用对话框在这里提交JS，一切正常，包括验证，但我想添加.dialog，以便用户知道表单已正确提交。我无法弄清楚如何将所有这些结合起来并使其发挥作用。有什么建议吗？

这也是在c＃中完成的，所以btnRequestSampleSubmit正在使用输入字段将表单提交到电子邮件的方式。