I have a following form in my HTML
code.
When I forget to fill in the surname,
the form will show me a "bubble message" You have to fill in the surname
, then I
will fill in the surname, press the submit button and the values are submitted.
When I forget to change the default option from <select>
the form will show
me a "bubble message" You have to choose something
, then I will choose another option,
press the submit button, but the values are not submitted. I always have to refresh
the page. Do you know where is the problem and how to achieve it without refreshing?
<form action="add" method="post">
...
<select id="choice" name="choice"
required oninvalid="setCustomValidity('You have to choose something')"
oninput="setCustomValidity('')">
<option value="" selected="selected"></option>
<option value="first">first</option>
<option value="second">second</option>
</select>
...
<input type="text" name="surname" id="surname" value=""
required oninvalid="setCustomValidity('You have to fill in the surname')"
oninput="setCustomValidity('')">
...
</form>