color by choice in dropdown

  • Resolved m0z4r

    (@m0z4r)


    3 years, 1 month ago

    Hello super dev
    1. I would like to know if it is possible to give a different color for each choice in the dropdown list to be able to make categories in the same dropdown.
    2. I have read the tutorial on the dropdown so I understand that it is possible to display an image depending on the choice we make, I would like to know if it is possible for example that for each choice I make it adds my choice to an empty fieldset as for a shopping list because otherwise it deletes my first choice to put another instead.

    I found a perfect example to show you easily:
    https://rok-calculator.com/equipment-calculator

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author codepeople

    (@codepeople)

    Hello @m0z4r

    Our plugin allows you to create forms, it is not a shopping cart. You could implement a shopping cart, but it would be your form’s code and not a feature of the plugin.

    To change the colors of a dropdown field options:

    1. Assign a custom class name to the dropdown field. Ex. color-list

    Enter the class name into the “Add CSS Layout Keywords” attribute of the DropDown field.

    2. Define the new class into the “Customize Form Design” attribute in the “Form Settings” tab (https://resources.developers4web.com/cff/images/documentation/form-settings-tab.png)

    .color-list option:nth-child(1){color:red !important;}
.color-list option:nth-child(2){color:green !important;}
.color-list option:nth-child(3){color:blue !important;}
.color-list option:nth-child(4){color:yellow !important;}

    Best regards.

    Thread Starter m0z4r

    (@m0z4r)

    thank’s super dev, `it works perfectly, to add and remove one of the choices I will try to insert that with buttons in a fieldset that adds it to another, I will eventually find a solution ?? Great work, thank you very much.
    I added custom-class in front because I do not know if it is mandatory
    like this:

    .custom-class-color-list option:nth-child(1){color:#ec8f38 !important;}
    .custom-class-color-list option:nth-child(2){color:#ec8f38 !important;}
    .custom-class-color-list option:nth-child(3){color:blue !important;}
    .custom-class-color-list option:nth-child(4){color:yellow !important;}

    having put custom-class-color-list in the css field

    if it can help someone who has the same problem, here you go. have a nice day.

    Plugin Author codepeople

    (@codepeople)

    Hello @m0z4r

    Excellent !!! Thanks for sharing your solution.

    Best regards.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘color by choice in dropdown’ is closed to new replies.