-
schenkcoAsked on February 12, 2016 at 1:33 PM
-
CharlieReplied on February 12, 2016 at 2:06 PM
I can't find that form in your account, I presume you are referring to a different form or a sample form.
I have another workaround that might suit you. Here's a test form that I have: https://form.jotform.com/60425807621957. See if that is something that would work for you. You can clone it to see how I have set it up.
Here's how to recreate that:
1. First, I'll recreate your products and categorize them. Here's a guide: http://www.jotform.com/help/264-Create-Sub-Products-Based-on-a-Product-Option
2. In my case, I separated them in two categories, "Category 1 - Brown" and "Category 2 - White".
3. In the sub product listing, you can actually add the HTML <img> tag on it. Here's mine:
4. After that, we'll follow the guide on how to make the product listing in multiple columns. I have already shared it on the original thread, but for reference, here's the link to it: http://www.jotform.com/help/235-How-To-Have-Two-Column-Payment-Form
The only difference that I made on the CSS code is setting the float value from "center" to "left". Here my CSS code:
.form-product-item {
border : 1px solid #EFEFEF;
margin : 1px;
float : left;
width : 253px;
}
.form-product-item + br {
display : none;
}
br + b {
float : left;
padding-top : 20px;
}
.form-payment-total {
line-height : 50px;
margin : 1px;
border : 0px solid #EFEFEF;
border-radius : 4px;
padding : 15px;
padding-right : 193px;
padding-left : 6px;
}
Noticed in my test form that each product opens and closes, would you like that to remain or you want each category to be open always?
Let us know if that will somehow work for you. I understand that we have already provided different ways on how you can do this, I hope we're not confusing you. It's best to have a lot of options, depending on how your form works.