Jump to content
  • 0

Display Only Fields - formatting?


georgep
 Share

Question

We are looking to have a responsive datapage form that includes a mix of normal Text, Calendar and Text Area fields etc - alongside an equal number of Display Only fields.

Our issue is that whilst you can style fairly readily the other fields it's not so easy with Display Only fields.

We would like a box round our Display Only fields to highlight that their contents is data (as a deafult in Capsio  it just shows as plain text and is confusing round what is the field name and what is the data).  Our plan was to use a boarder box to surround the data. We sort of got this to work - m ostly - with CSS.  However we note that when the field is empty the border collapses to a very narrow box. You can see this in our screenshot below.  The field "Staff Grade" is just a narrow box as it has no content.

Does anyone have any ideas or work arounds for how format this field so it will display like the others when blank or with content?

George

 

765599352_ScreenShot2021-05-17at5_12_32PM.thumb.png.6979047d29059e1464cfec4434349598.png

Link to comment
Share on other sites

3 answers to this question

Recommended Posts

  • 0

Hi @georgep,

For the Display only fields on the Details page, it is possible to change styling in the Styles tab. It should be needed to add the 'min-height' to make the fields look the same. 

You may go to Styles -> Form/Details -> Layout -> Source. Find .cbFormDataCell and .cbFormDataCellNumberDate classes and set the 'min-height' property to the needed value.

So even if the field will be empty, the data cell will have min-height to it. 

image.png

Hope this helps!

Link to comment
Share on other sites

  • 0

That was really helpful and an eye opener.  We have now got the height sorted.  Many thanks Sandy159

Our last issue however is to do with field length.  In the screenshot above the Display Only fields match the length of the normal Text Filed (one with white background). Hoever if all fields within a section are Display Only then they dont get forced to match page size.  Is there any way round this?

G

 

Link to comment
Share on other sites

  • 0
45 minutes ago, georgep said:

That was really helpful and an eye opener.  We have now got the height sorted.  Many thanks Sandy159

Our last issue however is to do with field length.  In the screenshot above the Display Only fields match the length of the normal Text Filed (one with white background). Hoever if all fields within a section are Display Only then they dont get forced to match page size.  Is there any way round this?

Do you want the fields to stay the width they are in the screenshot at all times? You could go to the same place that @sandy159 showed you in the screenshot. Change 'width: auto' to 'width: 100%;'.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

×
×
  • Create New...