You are viewing limited content. For full access, please sign in.

Question

Question

Yes/No questions be grouped under a single heading.

asked on December 7, 2018

Do any of the information systems for which an exception is being sought contain:
            * Health information?               ⦿ Yes  ⦿ No

            * Financial information?           ⦿ Yes  ⦿ No

            * Student information?             ⦿ Yes  ⦿ No

            * Research information?            ⦿ Yes  ⦿ No

 

One of our client asking to group yes/no question in single heading.

Any one can help me with this.

 

Thanks 

 

0 0

Replies

replied on December 7, 2018 Show version history

For all of the subsequent fields (everything except the first one) add a custom CSS class of "labelHide"

Then, if you're using top labels add the following CSS to your form in the CSS/JavaScript tab

.labelHide .cf-label {
    display:none;
}

If you're using left labels, change display:none; to visibility:hidden; instead to keep them aligned.

 

However, it looks like you still want a label for each field, so your best bet is probably just to leave them as-is and put them all into a Section with the heading you want.

Then you can apply a custom CSS class like "fieldList" to the section itself and use that to change the heading style or apply styles to the child fields, like indents or changing the label fonts to regular instead of bold like so:

.fieldList .cf-section-header {
  border:none;
}

.fieldList h2 {
  font-size:14px !important;
  font-weight:bold !important;
}

.fieldList li {
  margin-left:20px;
}

.fieldList .cf-label {
  font-weight:normal !important;
}

NOTE: If you add a section, make sure to add another section right after those fields to keep subsequent fields separated. You can hide the header and label for the separator section if you don't want it visible.

1 0
replied on December 7, 2018

Thank you so much ...I will try this 

0 0
replied on December 7, 2018

Can you tell me how to add in the Forms ?

0 0
replied on December 7, 2018 Show version history

Which part? To add the CSS class, select the section, select Edit, then open the Advanced tab and there's a plass for adding the "fieldList" class.

 

For the CSS, there's a tab for CSS/JavaScript toward the top on the right

0 0
replied on December 7, 2018

Thank you 

0 0
replied on November 27, 2019

Hi Jason,

for my understanding, if I added another section and put the value "fieldList" under the CSS class, how would I differentiate the two in the CSS code?

0 0
replied on November 27, 2019

It's been awhile since I played with this specific example, but if you're using separate section headers the CSS above is looking at the children within the section(s) with that class so you shouldn't need to distinguish at all.

What was the reason you needed to differentiate between the two? That will make a big difference in how you should probably handle it.

0 0
replied on November 27, 2019

I'm just trying to better understand the logic - no application right now. Thanks for the quick response!

0 0
replied on November 27, 2019

Fair enough. The way that CSS is designed each section should still be pretty self contained. It actually utilizes the built-in separation of the sections and just makes adjustments to the header and contents.

0 0
replied on December 7, 2018

Any update in this question...

0 0
You are not allowed to follow up in this post.

Sign in to reply to this post.