Allow rendering of fields without labels

  • 2
  • Idea
  • Updated 4 years ago
  • Implemented
I'd like to be able to render an editable field on a page without having a label or the space allocated for the field label, making it take up as little space as possible. In some cases I can put multiple fields stacked in a Field Editor Column and have the column label suffice, like a virtual table, such as:

Right now I could leave the labels blank (with a space), but the space is still allocated for it on the page. (In this particular situation, I can't make an actual table out of it, because the fields are all individual ones on one object.)
Photo of Peter Bender

Peter Bender, Champion

  • 6,246 Points 5k badge 2x thumb

Posted 6 years ago

  • 2
Photo of Ben Hubbard

Ben Hubbard, Employee

  • 12,490 Points 10k badge 2x thumb
Hi Peter, Try adding this CSS code as an inline resource.

.nx-basicfieldeditor-item-label {
display: none;
}

.nx-basicfieldeditor-item > .nx-field {
width: 100%;
}

This will cause all field editor labels to be hidden. Is that too global for your case? Or will that work.
Photo of Ben Hubbard

Ben Hubbard, Employee

  • 12,490 Points 10k badge 2x thumb
If that global change doesn't do what you need, there are some pretty cool new features coming to the field editor in Skuid 2.28+. Once this version is released, there will be a pretty easy way to do this without messing with CSS.
Photo of Peter Bender

Peter Bender, Champion

  • 6,246 Points 5k badge 2x thumb
In my current use case using CSS to make such a change global wouldn't work, but it will be handy to be able to do this in the new version. Thanks!
Photo of Glenn Elliott

Glenn Elliott, Champion

  • 7,738 Points 5k badge 2x thumb
Ben ... I have the same need as Peter, to display fields in a table without labels. I like your CSS code, but it's too global for me as I just want to do it to one or two tables. I can't find how this was implemented in v2.28+. Can you point me to it perhaps?

Thanks.
Photo of Glenn Elliott

Glenn Elliott, Champion

  • 7,738 Points 5k badge 2x thumb
I addressed this for my use case, so thought I'd share it.

I have a page with a tab set and I want to hide table headers only within some tabs. The solution was to give each tab a unique id, then make the CSS specific to the thead element just within those tabs. e.g. I want it to work in the people tab, so:

#people thead{
display: none;
}


did the trick.
Photo of Peter Bender

Peter Bender, Champion

  • 6,246 Points 5k badge 2x thumb
So is there a way now to show fields/templates without displaying a label and without reserving space for the label?
Photo of Amr

Amr

  • 256 Points 250 badge 2x thumb
I am stuck with the same ... is there any resolution to this?
Photo of Rob Hatch

Rob Hatch, Official Rep

  • 44,006 Points 20k badge 2x thumb
Since the summer of 2013 you have had the ability to display fields with thier labels on top.  In this situation if you add a single blank space to your custom label property - the space where the lable would normally sit is removed. 

In the situation below the Section Name is taking the function of the label and the field itself does not have one. 

Photo of Amr

Amr

  • 256 Points 250 badge 2x thumb
That does the trick ... thanks Rob for ongoing and immediate support