Can I apply the required attribute to ` element does not work or can't apply with CSS `:invalid`. – vee Mar 31 '22 at 07:25

Question

<form action="">

<select required>

  <option selected disabled value="">choose</option>
  <option value="red">red</option>
  <option value="yellow">yellow</option>
  <option value="green">green</option>
  <option value="grey">grey</option>

</select>
<input type="submit">
</form>

score 2 · Answer 1 · answered Jul 22 '14 at 13:32

2

<form action="">

<select required>

  <option selected disabled value="">choose</option>
  <option value="red">red</option>
  <option value="yellow">yellow</option>
  <option value="green">green</option>
  <option value="grey">grey</option>

</select>
<input type="submit">
</form>

answered Jul 22 '14 at 13:32

yatou

57
1

5

This answer merely repeats a previous example with no additional explanation. – james.garriss May 19 '15 at 11:05
1

Please add some explanation to your answer such that others can learn from it – Nico Haase Sep 28 '21 at 08:58

score 2 · Answer 2 · answered Mar 16 '18 at 10:02

2

try this, this gonna work, I have tried this and this works.

<!DOCTYPE html>
<html>
<body>

<form action="#">
<select required>
  <option value="">None</option>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>
<input type="submit">
</form>

</body>
</html>

answered Mar 16 '18 at 10:02

sayyed tabrez

116
1
1
11

1

Please add some explanation to your answer such that others can learn from it – Nico Haase Sep 28 '21 at 08:57

score 1 · Answer 3 · edited Jul 22 '16 at 09:18

1

Make the value of first item of selection box to blank.

So when every you post the FORM you get blank value and using this way you would know that user hasn't selected anything from dropdown.

<select name="user_role" required>
    <option value="">-Select-</option>
    <option value="User">User</option>
    <option value="Admin">Admin</option>
</select>

edited Jul 22 '16 at 09:18

Alok Patel

7,842
5
31
47

answered Jul 22 '16 at 06:37

santosh devnath

144
6

score 1 · Answer 4 · answered Jul 17 '17 at 06:05

1

first you have to assign blank value in first option. i.e. Select here.than only required will work.

answered Jul 17 '17 at 06:05

ayush

19
2

score 1 · Answer 5 · answered May 11 '20 at 13:16

Works perfectly fine if the first option's value is null. Explanation : The HTML5 will read a null value on button submit. If not null (value attribute), the selected value is assumed not to be null hence the validation would have worked i.e by checking if there's been data in the option tag. Therefore it will not produce the validation method. However, i guess the other side becomes clear, if the value attribute is set to null ie (value = "" ), HTML5 will detect an empty value on the first or rather the default selected option thus giving out the validation message. Thanks for asking. Happy to help. Glad to know if i did.

score -1 · Answer 6 · answered Jan 11 '16 at 03:09

-1

In html5 you can do using the full expression:

<select required="required">

I don't know why the short expression doesn't work, but try this one. It will solve.

answered Jan 11 '16 at 03:09

Roger Rocco

15
1

score -4 · Answer 7 · answered Apr 17 '13 at 07:01

-4

Try this

<select>
<option value="" style="display:none">Please select</option>
<option value="one">One</option>
</select>

answered Apr 17 '13 at 07:01

user2289459

21

Please add some explanation to your answer such that others can learn from it – Nico Haase Sep 28 '21 at 08:58

score -5 · Answer 8 · edited Oct 01 '15 at 11:07

-5

You can do it also dynamically with JQuery

Set required

$("#select1").attr('required', 'required');

Remove required

$("#select1").removeAttr('required');

edited Oct 01 '15 at 11:07

james.garriss

12,959
7
83
96

answered May 12 '14 at 15:59

mdelafuq

130
3
12

Can I apply the required attribute to ` element does not work or can't apply with CSS `:invalid`. – vee Mar 31 '22 at 07:25

Linked

Related