Native Dropdown: Blank Option above dropdown options errors on submit

Hello,

Dropdown menu shows "BLANK OPTION" above other option, some has even below.

when user select all option by "CTRL A"  then "BLANK OPTION" also get selected.

Upon submission its show error because of selection "BLANK OPTION" .

Same issue on Mobile phones

Client does not understand this and get frustrated please Help Or Remove blank options from all field.

Thankyou.

Hello

Right now it is not possible to remove the blank option from the drop down menu. If you are using the source code to display the form you can edit the source code and and remove or disable the blank option so that it will be not selected when you press Ctrl + A.

Example below 

<label class="form-label form-label-top form-label-auto" id="label_74" for="input_74">

            Mumbai Suburban Lines

            <span class="form-required">

              *

            </span>

          </label>

          <div id="cid_74" class="form-input-wide jf-required">

            <select class="form-dropdown validate[required]" id="input_74" name="q74_mumbaiSuburban[]" style="width:150px;" multiple="" data-component="dropdown" required="">

              <option value="" disabled="disabled" selected="selected">  </option>

              <option value="Western"> Western </option>

              <option value="Central"> Central </option>

              <option value="Harbour"> Harbour </option>

Hope this helps. 

Feel free contact us in case you need further help on this. 

Did you find any solution for this as it is creating lot of issue for user to fill up the form ?

I do not have any knowledge of coding.

And this problem of "Blank Option " is there in and every dropdown field of my form.

Please Help.

Apologies for the inconvenience caused to you.

As a workaround, you can write some text in Empty option for example "Please choose an option".

Let us know if this was helpful. We would be happy to assist you.

Thanks.

Even If we do this and user select ALL option by using "CTRL+A" , "Please choose an option" will also be selected and prompt error while submission which make user confused and runaway without filling form.

Also, How Blank option at the bottom of Dropdown will be elominated by this suggesstion?

You guys have very good team at jotform ,why don't you remove blank option completely ?

please provide with better solution , I am stuck with this from past 6 months already.

Thankyou.

I investigated this on your form and I could replicate this issue. 

As a workaround, I can suggest you use visual_multi_select widget

https://widgets.jotform.com/widget/visual_multi_select

Let me forward the thread to our backend team for review. You will be notified on this thread.

Thanks.

 You can also use multiple selection widget in your form. 

https://widgets.jotform.com/widget/multiple_selection

The problem with using widget is-
1) I am using 3 widget on my form. 

i) Short Scrollable Terms

ii) Appointment Slots

iii) Spreadsheet

Problem with this all three is that sometimes it goes blank completely (White blank space appears) or does not appear to user at all.
so ,i find using widget makes form more complicated.
But this completely different issue as per my current thread.

This not  solution but few days escape .

2) I have already taken large data using my current form field ,changing it fields will make things more complicated then as it is now.

finally , take your time and please remove below and above "Blank Option".

I know this is very small issue for  Jotform Team but it only matters your focus towards this issue.

Thank you.

Apologies for the inconvenience caused to you.

Another workaround I can suggest If you want to use the native dropdown you can also inject the following CSS code in your Form Designer. I have tested in my form and it is working.

You could technically hide it through CSS - so that your form is in the form builder

select > option[value=""] {
    display: none;
}

You can refer to this guide to inject Custom CSS code in your form:

https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes

Hope this helps!

Thanks.

This problem has been solved.

Thankyou so much for the help.

Thanks alot.

Hi there,

This problem is resolved completely. You don't have to css trick now if you want.

Best Regards.