Need form dropdown placeholder text not to be selectable?

Design help General
1

When I create a drop down field in a form, I want there to be placeholder text that is NOT selectable.

However the only way I seem to be able to do this is to make the top option say, for example, ‘country’. It’s annoying as some people then choose ‘country’ as a value.

2

Share link please.

3

Hi Alex, thank you for the tip here - sorry I missed the alert to it!

Here is the link to the site that I’m having a problem on: https://preview.webflow.com/preview/virtual-cabinet-449919?preview=7f9718a2b2c5a06d898e5dba129a561c

4

Hey Matthew,

Since you are using a common class for each of the dropdowns , Select-form , we could loop through all of them and disable the first option in each by placing this piece of code in the footer section (before </body>) of custom code;

<script>
  $( document ).ready(function() {
     $('.select-form').each( function () {
        $(this).children('option:first').attr("disabled", "disabled");
      });
   });
</script>

Let me know how this works for you.

5

Thank you so much for your extremely quick reply Alex!

Yes is is now fixed. I really appreciate it!

6

Great to know and you are very welcome… Enjoy.