Dropdown in form required - html

Question

I have to make a form for a contact page.
I want that people put their names, email, phone number etc. etc. in different input's. The input's are all tagged with REQUIRED.
If I try to submit the form and I forget to fill in for example a name, it will give a notification that you didn't fill in your name.
That's good.
However, my dropdown menu is also required even if I don't select a value from the dropdown, I will not get a notification.
<div class="form-group">
<select class="selectpicker" name="dropdownmenu" id="selectpicker" required>
<option selected="selected" value="first_value" disabled>Kies je onderwerp</option>
<option value="dropdown_advertentie">Advertentie</option>
<option value="dropdown_suggestie">Suggestie</option>
<option value="dropdown_opmerking">Opmerking</option>
</select>
So the first value, 'Kies je onderwerp' is selected when you open the page. But when that is still selected and you click the submit button, I need a notification that you didn't select a value.

Answer 1

Your value for the first option has to be empty for a required check.
<select required>
<option value="">Kies je onderwerp</option>
<option value="dropdown_advertentie">Advertentie</option>
<option value="dropdown_suggestie">Suggestie</option>
<option value="dropdown_opmerking">Opmerking</option>
</select>

Answer 2

you can use a js validation as bellow
function validateForm() {
var x = document.forms["myForm"]["field_name"].value;
if (x == ""|| x=="first_value") {
alert("Name must be filled out");
return false;
}
}

Answer 3

If you are not ready to leave it empty, you can validate it by using below script. Check below snippet for reference.
$('#btnSubmit').click(function() {
if ($('#selectpicker :selected').text() == 'Kies je onderwerp') {
alert('please select a valid value');
}
return false;
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form><select class="selectpicker" name="dropdownmenu" id="selectpicker" required>
<option selected="selected" value="first_value" disabled>Kies je onderwerp</option>
<option value="dropdown_advertentie">Advertentie</option>
<option value="dropdown_suggestie">Suggestie</option>
<option value="dropdown_opmerking">Opmerking</option>
</select>
<input type="submit" id="btnSubmit" value="submit">
</form>