Dropdowns not working properly in Configurable list widget

  • LoRihvk
    Asked on December 11, 2014 at 6:39 AM

    hi 

    this morning we realised a problem in our application form with drop down menus. 

    nobody changed anything and therefore would appriciate if you can let me know what might be wrong. that the dropdown menu does not work as required.

    as it is urgent, then please answer as soon as possible! the code in dropdown is as advised on your site 

    *University: dropdown : please select, Agricultural University of Georgia, Akaki Tsereteli State University, Batumi Shota Rustaveli State Univerersity, Caucasus International University, Caucasus University, European Teaching University, East European Teaching University, Ekvtime Takaishvili Teaching University, Free University of Tbilisi,Georgian Technical University, Grigol Robakidze University, Ilia State University, Ivane Javakhishvili Tblisi State University, Saint Andrews Georgian University, Samtskhe-Javakheti State University, Shota Rustaveli University of Theater and Cinema, Sokhumi State University, Sulkhan-Saba Orbeliani Teaching University,Tbilisi State Academy of Arts,Tbilisi State Medical University, Telavi Iakob Gogebashvili State University, University of Georgia

    *Field of Study : dropdown : please select, Agriculture, Arts, Computes Sciences, Economics and Business, Education, Engineering, Humanities, Law, Media, Medicine, Natural Sciences, Polical and Social Sciences, Tourism

    *Level of Education : dropdown : please select, undergraduate, master, PhD

    *Role in the team : dropdown : please select, team leader, programmer, field expert, designer, project manager, marketer

    Dropdowns not working properly in Configurable list widget Image 1 Screenshot 20

  • Ben
    Replied on December 11, 2014 at 10:05 AM

    Hi,

    Looking at the Configurable List widget I have noticed that you have entered "DropDown" instead of "select". This is why the widget had shown the text field instead of the dropdown.

    After changing that and adding comma in the University dropdown instead of ":" everything was working properly.

    You can clone my clone of your jotform: http://form.jotformpro.com/form/43444190513954

    If you are not sure how to do that, you can follow these steps: How to Clone an Existing Form from a URL.

    If you would rather to just add the right text to Configurable List, then please copy next text in blue:

    *Full name: textbox
    *E-mail: textbox
    *ID number : textbox
    *University:select:please select, Agricultural University of Georgia, Akaki Tsereteli State University, Batumi Shota Rustaveli State Univerersity, Caucasus International University, Caucasus University, European Teaching University, East European Teaching University, Ekvtime Takaishvili Teaching University, Free University of Tbilisi,Georgian Technical University, Grigol Robakidze University, Ilia State University, Ivane Javakhishvili Tblisi State University, Saint Andrews Georgian University, Samtskhe-Javakheti State University, Shota Rustaveli University of Theater and Cinema, Sokhumi State University, Sulkhan-Saba Orbeliani Teaching University,Tbilisi State Academy of Arts,Tbilisi State Medical University, Telavi Iakob Gogebashvili State University, University of Georgia
    *Field of Study: select: please select, Agriculture, Arts, Computes Sciences, Economics and Business, Education, Engineering, Humanities, Law, Media, Medicine, Natural Sciences, Polical and Social Sciences, Tourism
    *Level of Education: select: please select, undergraduate, master, PhD
    *Role in the team: select: please select, team leader, programmer, field expert, designer, project manager, marketer

    You can see in bold the sections that I have changed.

    I would also suggest looking at this guide for further Configurable List optimizations: How to Set Up the Configurable List Widget

    Do let us know if you have any further questions.

    Best Regards,
    Ben

  • LoRihvk
    Replied on December 11, 2014 at 10:46 AM

    thank you, Ben.  it is working now. but how is it possible to make all the dropdown boxes equally wide? right now the box "university" is too wide as well as "Field of Study".

    thank you

    Lo 

  • Ben
    Replied on December 11, 2014 at 12:08 PM

    Hi Lo,

    I have updated the http://form.jotformpro.com/form/43444190513954 with a bit of style so that the dropdowns are shown a bit less wide.

    Now, they get as wide as the longest text in them, but we can still make the dropdown itself shown as less wide - the list however will still be shown as wide as it is needed to show the options in one line.

    This is the code that I have added:

    td {
        max-width: 160px;
        min-width: 125px;
    }
    select {
        width: 100%;
    }

    If you want to further change the width of them, you should change the td rule only and select will follow (it will take full width of the td element).

    Now this style is added in the Configurable List itself, it does not fall under the jotform styles.

    To change it click on its wizard (as you had added the fields) and scroll down until the CSS field

    Dropdowns not working properly in Configurable list widget Image 1 Screenshot 20

    Do let us know if you have any further questions.

    Best Regards,
    Ben