Add classes to field editor fields

  • 2
  • Question
  • Updated 1 month ago
  • In Progress
So I've been going over the forum here for a few days now and haven't really found an answer to this.

We're building a fairly big system with Skuid and in it there are a lot of field editors with varying user permissions. So fields can be read/edit at some levels, readonly at others.

What we'd like to do is assign generic classes to fields/rows based on field type and read status that can be used for styling.

An example would be, readonly fields having a lock icon and different hover state.

This would ideally be without custom field renderers and be model agnostic. We just want it work system wide on any field editor.

Being able to have an end result like this would be great:
<div class="nx-basicfieldeditor-item picklist readonly" guid="11">
I can achieve it with custom field renderers (which I'm using in my test page) but having to go through 100's of templates to assign custom field renderers (or find and replace XML) seems overly cumbersome.

So I figure this has to be a snippet, but the question is how do I access the field type and read status without specifically targeting a model or field? Then go over each row and add the classes?

Every similar example (Matt's global renderer for instance) for things like global custom fields target specific models/fields.

I've been able to do some pretty gnarly things with CSS already, but this one is causing issues because I have nothing to really latch onto.

Photo of Craig Regnier

Craig Regnier

  • 134 Points 100 badge 2x thumb

Posted 3 months ago

  • 2
Photo of Bill McCullough

Bill McCullough, Champion

  • 9,888 Points 5k badge 2x thumb

Not sure if this will get you the XMLDocument for the Skuid page a field that is readonly has the following format:

<field uniqueid="sk-2dmOvS-309" id="SicDesc" valuehalign="" type="" readonly="true"/>

The 'id' corresponds to the API name for the field.  Maybe you can run a script at page load that iterates through the XML and adds the 'readonly=true' parameter to your list of fields?  Then you would re-render the page?


Photo of Josef Lagorio

Josef Lagorio

  • 2,038 Points 2k badge 2x thumb
An example would be, readonly fields having a lock icon and different hover state
Craig, were you ever able to get that figured out?