C# HTML5 表单在必填字段留空时提交答案

【问题标题】：C# HTML5 form submits when required fields are left emptyC# HTML5 表单在必填字段留空时提交
【发布时间】：2015-12-01 14:56:34
【问题描述】：

我使用 HTML 控件制作了一个简单的登录表单，但在服务器端运行它们以在 C# 中使用它们。

<button id="btnSignIn" class="btn btn-lg btn-info btn-block" type="submit" runat="server" onServerClick="btnSignIn_ServerClick">Sign in</button>

当我点击它时，如果必填字段为空，它仍然会刷新并且不显示 HTML5 验证。

<label for="txtUsername" class="sr-only" runat="server">Username</label>
<input type="text" id="txtUsername" class="form-control" placeholder="Username" runat="server" required autofocus />
<label for="txtPassword" class="sr-only" runat="server">Password</label>
<input type="password" id="txtPassword" class="form-control" placeholder="Password" runat="server" required />

它工作正常，除非字段为空。它会进行少量刷新，而不是显示该字段为空的 HTML5 警报。

编辑
我设法通过将按钮更改为输入来修复它。

<input id="btnSignIn" class="btn btn-lg btn-info btn-block" type="submit" runat="server" onServerClick="btnSignIn_ServerClick" value="Sign In" />

【问题讨论】：

你是在支持 HTML5 的浏览器中运行它吗？
是的。事实上，在页面刷新之前通知几乎不会出现。
你能看看我在下面发布的小提琴吗？看看这是否对你有用。
您的意思是 asp.net 而不是 asp-classic？
是的。抱歉，我标记得太快了。

标签： javascript c# asp.net html

【解决方案1】：

请查看this fiddle 看看是否有帮助。对我来说它工作正常。

<form>
<label for="txtUsername" class="sr-only" runat="server">Username</label>
        <input type="text" id="txtUsername" class="form-control" placeholder="Username" runat="server" required autofocus />
        <label for="txtPassword" class="sr-only" runat="server">Password</label>
        <input type="password" id="txtPassword" class="form-control" placeholder="Password" runat="server" required />
<input type="submit" />
</form>

【讨论】：

我认为这是因为“onServerClick”，但我想确认一下。小提琴奏效了。
必须是由于服务器上的其他调用，可能是成功后重定向的 ajax 调用。事实上，表单是 HTML5 required 属性的正确用法。
我修好了。我将它从按钮更改为输入并且它起作用了。不过感谢您的帮助！
<button type="submit">Sign In</button> 也可以。