HTML5 required="" attribute with .NET webforms

Question

I'm trying to use the new required attribute on form fields in my .NET 4.5 webforms application.

However, since there is only one <form> surrounding all the controls on the page (webforms style), the browser does not know which fields to be validated when a submit button is pressed.

A stripped version of a page with both login functionality and a page search is attached below.

When I click the Search button my browser tell me that i have to fill in the username and password fields first. And when I try to login it tells me I have to enter some text in the search field. Because all of the fields are children of the same <form> tag.

Any one else had this problem or came up with a solution? I would like to use the HTML5 attributes for form validation, no javascript solution.

<!DOCTYPE html>

<html>
<head>
    <title>Title</title>
</head>
<body>
  <form method="post" runat="server" id="mainform">


    <%// Search %>
    <asp:Panel runat="server" DefaultButton="searchButton" >

      <asp:TextBox runat="server" ID="searchQuery" ClientIDMode="Static" required="required" />
      <asp:Button runat="server" ID="searchButton" ClientIDMode="Static" Text="Search"/>

    </asp:Panel>


    <%// Login %>
    <asp:Panel runat="server" DefaultButton="signInButton">

      <label for="inputusername">Username</label>
      <asp:TextBox runat="server" ClientIDMode="Static" ID="inputusername" required="required" />

      <label for="inputpassword">Password</label>
      <asp:TextBox runat="server" TextMode="Password" ClientIDMode="Static" ID="inputpassword" required="required" />

      <asp:Button ID="signInButton" runat="server" />

    </asp:Panel>

  </form>
</body>
</html>

</html>

Can't do that. The form tag has to wrap all the server controls... — chilly
– chilly, Commented Mar 15, 2013 at 14:34
The HTML5 required attribute does not allow setup by any group, and ASP.NET does not (without tomfoolery) allow multiple form tags (with server controls). You could instead use RequiredFieldValidator and set the ValidationGroup properties of the associated controls. — Mike Guthrie
– Mike Guthrie, Commented Mar 15, 2013 at 15:28

indofraiser · Accepted Answer · 2016-02-11 12:24:40Z

5

Try this please.. It worked for me..

<asp:TextBox runat="server" 
             ClientIDMode="Static" 
             ID="inputusername"                    
             required />

edited Feb 11, 2016 at 12:24

indofraiser

1,0203 gold badges18 silver badges54 bronze badges

answered Mar 25, 2015 at 9:42

Ahsan Raza

1411 silver badge4 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Benjamin Ray Over a year ago

Is the duplicate ClientIDMode="Static" intentional?

Ripside · Accepted Answer · 2016-12-13 14:07:15Z

-1

Add novalidate attribute to the Search button. It's that easy.

http://www.w3schools.com/tags/att_form_novalidate.asp

answered Dec 13, 2016 at 14:07

Ripside

1632 silver badges8 bronze badges

Comments

JimMSDN · Accepted Answer · 2014-06-29 15:02:21Z

-4

Since the ASP.Net Web Forms programming model does not allow multiple HTML tags, this is something you cannot take advantage of.

answered Jun 29, 2014 at 15:02

JimMSDN

4804 silver badges16 bronze badges

1 Comment

Shaharyar Over a year ago

See the second answer

Collectives™ on Stack Overflow

HTML5 required="" attribute with .NET webforms

3 Answers 3

1 Comment

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related