Is it possible to create a multiple column dropdown list?

  • Profile Image
    Asked on March 07, 2015 at 04:25 PM

    Hi there,

    Is it possible to have a dropdown list that has 2 columns but the first column is hidden? i.e.

    Column A  |  Column B

    1              | Apple

    2              | Orange


    I'm looking to use column A as a ID Field on my database so ideally I need it hidden on the form.

    is this possible, apologies if its confusing

    Many thanks





  • Profile Image
    Answered on March 07, 2015 at 05:21 PM

    I'm sorry, but I'm not sure if I understand your question correctly.
    From what I understand you want to collect an ID based on the selection made in a drop-down list, but you're also mentioning a database.

    Unfortunately, what you're mentioning is not possible to accomplish using a drop-down list. However, there are other methods that could be implemented to achieve something similar but I would like to know more about what you have in mind to see if they would be applicable or not. I mean, you can send your submissions directly to a MySQL database so if you want to use an ID to run queries for example there would be no need to do this since you'll have all your data in the DB.

    Please provide more details about what you want to do, so we can better understand and provide the appropriate assistance.

    Thank you.

  • Profile Image
    Answered on March 07, 2015 at 05:28 PM

    Many thanks for your reply,

    Okay try to forget that I mentioned a database. I just want a dropdown list that has 2 columnsL

    1 | Orange

    2 | Apple

    3 | Banana

    Where the numbers are i'd like them to be hidden from the dropdown list, so the options would look like this to the user selecting them:




    is that possible?



  • Profile Image
    Answered on March 07, 2015 at 05:48 PM

    Please check this form:

    I added a drop-down list and a calculation widget to assign the selected ID, the trick to making it work is to populate the Calculation Values property in the drop-down field so the widget gets populated when a selection is made.

    I left the widget visible so you can see how it works, but you can also hide in your form so your users won't see it.

    Let us know if this is what you're looking for and if it is, feel free to clone the form to your account if you want to.

  • Profile Image
    Answered on March 08, 2015 at 04:30 PM

    Hi again,

    Although this method, my droplist will contain over 200 options which will take ages to apply each calculation.

    Is there some CSS we can apply to add / hide a column in the droplist???

  • Profile Image
    Answered on March 08, 2015 at 06:58 PM

    Since CSS is really just about presentation, no such solution would be possible. However, if the calculations for 200 items slows down the response of the form to changes, an alternative workaround would be to copy the form's full source to a web page of your own and then add a script to populate the ID box. Custom scripts can't be used in the form builder. That's why it would be necessary to embed a copy of the form code somewhere else. I'll whip up a demo for you shortly to show what I mean.


  • Profile Image
    Answered on March 08, 2015 at 08:20 PM

    Hi again,

    Please test this demo. The page contains a script which uses a switch statement to populate the Country ID box. As it's just meant to be an example, I included only the first ten (10) countries in the script. So, if any of the others is selected the Country ID box will display 0.

    The below video explains how a switch statement works but if you need assistance in implementing the solution in your jotform, we'd be glad to help.