I am trying to figure out how to change the colour of a selected checkbox button text, once clicked. I have removed the box, and turned the text in to a button it self.
I would like it to be a different colour once clicked, to signify that it has been selected. I have tried looking under the “states” section but no luck.
Is there also a way to have different form blocks on multiple sections on a page, but have only one submission button at the end of the form?
How can I have the answers for each form block sent to my email as one email once the user hits submit?
Great page @AlexManyeki ! This is exactly what I am looking for. How did you do this? How did you also add logic to the page to input my name in the next step?
I did it mainly with custom code using val(). and some if statements in jQuery.
You do not need to use multiple form blocks. You just have to put all your fields in sections (divs) just as you have done but inside one form element. Then the next button on each section can link to the next but all inside the form.
As for the checkboxes, here you need custom code. This time, DO NOT DELETE the checkbox field. We will be styling the checkbox element itself and reducing the opacity of the checkbox-field so that it is invisible but still present. Here is an example I just made for you. Pay attention to the structure and the active hidden active class on the topmost element.
EDIT: I just realized you can do this without custom code. You will need to add a div (bg-color) inside the checkbox element. use z-index to bring the checkbox field to front, above all other elements. the apply a click interaction to show the bg-color div on first click and hide it on second click. Long method but native.
Hello, I am still having trouble with the second option you have mentioned. I am not allowed to place a div inside the checkbox element. There is the TextBox field, the checkbox, and the text. Where should I place the Div?
