JQuery对话框中的ASP.NET表单在aspx页面上不起作用，但在HTML页面上起作用。

Question

我正在使用JQuery模式对话框来显示一个小表单，它在html页面上工作得很好(在Visual Studio2010中)。但是，当我在aspx页面中创建相同的表单时，表单提交并不能像预期的那样工作。即使是最简单的事情，如html5输入字段是必需的，当保留为空时也不会产生错误消息。我觉得aspx页面上有什么东西干扰了它。我认为我的asps页面中的表单标签和asp:content - 'HeadContent‘本身就是一个默认表单存在某种错误……有人能帮我解决这个问题吗？

这是我的html表单的样子：

https://plnkr.co/edit/uUWZc9PNSABQ9mpcwti9?p=preview

在aspx页面上产生相同的东西：

<%@ Page Title="About Us" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
    CodeBehind="About.aspx.cs" Inherits="CheckInSystem.About" %>

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css" />
    <script type="text/jscript" src="http://code.jquery.com/jquery-2.2.0.min.js"></script>
    <script type="text/jscript" src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
    <script src="Scripts/ProgramFiles/Popup.js" type="text/javascript"></script>
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
    <button id="create-user" type="button">Please Check-in</button>
    <div id="dialog-form" title="New Visitor Check-in">
     <form id="myForm" action="About.aspx" method="post">
      <p class="validateTips">
            All form fields are required.</p>
      <div class="formContainer">
        <div class="row">
          <b>Visitor:</b>
          <input id="visitor" type="text" runat="server" style="margin-left: 60px" required="true" />
        </div>
        <div class="row">
          <b>Type of Visit:</b>
          <asp:dropdownlist id="TypeOfVisitDesc" runat="server" datavaluefield="TypeOfVisitKey" datatextfield="TypeOfVisitDesc" cssclass="ddlist" datasourceid="TypeOfVisitDataSrc"></asp:dropdownlist>
          <asp:linqdatasource id="TypeOfVisitDataSrc" runat="server" contexttypename="CheckInSystem.CheckInSystemDataContext" entitytypename="" tablename="TypeOfVisits"></asp:linqdatasource>
        </div>
        <div class="row">
          <b>Visitee:</b>
          <input id="visitee" type="text" runat="server" style="margin-left: 59px" required="true" />
        </div>
        <div class="row">
          <b>Arrival:</b>
          <input id="arrival" type="text" runat="server" style="margin-left: 59px" required="true" />
        </div>
        <div class="row">
          <b>Departure:</b>
          <input id="departure" type="text" runat="server" style="margin-left: 33px" required="true" />
        </div>
      </div>
      <div>
        <input id="Submit1" type="submit" runat="server" value="Check-In" class="myButton" onclick="return true;" />
      </div>

     </form>
    </div>
</asp:Content>

我故意没有在后面插入任何代码..因为我想要的只是“必填”字段，以便在保留为空时显示错误...即使这样也行不通。

我认为我的asps页面中的表单标签和asp:content - 'HeadContent‘本身就是一个默认表单存在某种错误……有人能帮我解决这个问题吗？

Answer 1

required=true需要<form>元素来应用验证。

ASP.NET窗体将从页面中删除所有<form>标记，并将其替换为特定于ASP.NET窗体的自定义<form>元素。

这就是标准验证在ASP.NET表单下不起作用的原因。使用您的浏览器> View Source特性来查看ASP.NET生成的html代码。