How can I change the colour of one cell in a table?

  • gymfuse
    Asked on July 17, 2017 at 10:00 AM

    Hi guys,

     

    I have a list of products (size/colour in a table).

     

    I want to mark one option as out of stock.

     

    Is this possible, if so, how?

     

  • aubreybourke
    Replied on July 17, 2017 at 10:13 AM

    I cloned your form, and modified it. You can see it here:

    https://form.jotformpro.com/71973973530970

     

    Now to answer your question.

    You can use CSS. First you need to get the field ID:

    #1. Select a table

    #2. Click on properties (gear icon)

    #3. On the advanced tab, click on field details. You will see all the id's appear for the table.

    How can I change the colour of one cell in a table? Image 1 Screenshot 30

     

     

    Then you need to use custom CSS:

    #4. Select and copy the field you want to change

    #5. Paste the id in the box and add the code to style the field:

    #input_1_0_0

    {

    background-color: yellow !important;

    }

    Or, if you would like to disable the field (so the user cant type anything in) add this CSS: 

    #input_1_0_0

    {

    display: none !important;

    }

    So it will look like this:

    How can I change the colour of one cell in a table? Image 2 Screenshot 41

     

    #6. Remember to click the green save button!

     

  • gymfuse
    Replied on July 17, 2017 at 10:46 AM

    Fantastic support.

     

    Thanks a bunch