Display alternate rows of matrix field in different colors.

  • jagarolik
    Asked on December 30, 2015 at 11:23 AM

    Hi,

    I'm using jotform as a roll call time sheet for our volunteer fire department. There are many, many names in a long row, and it makes it challenging to click the right person at the right place.

    It would be very helpful if I could make every other row a slightly different color, maybe a light grey or light orange background. Is there a way to do this?

    Many, many forms and long matrices use this type of style, here is an example: https://cdn.ablebits.com/_img-blog/alternate-rows/default-table-style.png

    Form link: https://form.jotform.com/53634418851156

    Thanks!

  • Ashwin JotForm Support
    Replied on December 30, 2015 at 1:48 PM

    Hello jagarolik,

    Please take a look at the following cloned form and see if this is what you wanted to achieve: https://form.jotform.com/53634912588970 

    If yes then please copy the custom css code form the following URL and inject it in your form:  http://pastiebin.com/56842623a3b37 

    The following guide should help you how to inject custom css code in your form:  http://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes 

    The output of the above custom css code is displayed in the screenshot below:

    Display alternate rows of matrix field in different colors Screenshot 20

     

    Alternatively, you can clone the above form and start using it. The following guide should help you in form cloning:  http://www.jotform.com/help/42-How-to-Clone-an-Existing-Form-from-a-URL 

    Hope this helps.

    Do get back to us if you have any questions.

    Thank you!