Highlight a row based on value change in gridRowLayout

I'm also not exactly clear on the use case either, but unfortunately we can't modify grid layout row highlighting other than shading alternate rows. 

Assuming you want to flag the row when a user edits any of the data points in it, one option is to have an "Edited" type column which alerts that a change has been made by showing something such as a rich text icon.

That can be accomplished by creating a non-refreshing copy of the data as it initially arrives, and comparing it to the data being saved (rule input).

For this example, open a new interface and add a rule input "data" of "Any Type".

Set the Test Input for 'data' to:

{
  a!map(field1: "test a", field2: "test b", field3: "test c"),
  a!map(field1: "test a", field2: "test b", field3: "test c"),
  a!map(field1: "test a", field2: "test b", field3: "test c")
}

And add this in the interface code:

a!localVariables(
  local!data: a!refreshVariable(
    value: ri!data,
    refreshOnReferencedVarChange: false
  ),
  
  a!columnsLayout(
    columns: {
      a!columnLayout(),
      a!columnLayout(
        contents: {
          a!gridLayout(
            headerCells: a!forEach(items: {"Col 1","Col 2","Col 3","Edited"}, expression: a!gridLayoutHeaderCell(label: fv!item)),
            rows: a!forEach(
              items: ri!data,
              expression: a!gridRowLayout(
                id: fv!index,
                contents: {
                  a!textField(
                    value: fv!item.field1,
                    saveInto: ri!data[fv!index].field1
                  ),
                  a!textField(
                    value: fv!item.field2,
                    saveInto: ri!data[fv!index].field2
                  ),
                  a!textField(
                    value: fv!item.field3,
                    saveInto: ri!data[fv!index].field3
                  ),
                  a!richTextDisplayField(
                    value: a!richTextIcon(
                      showWhen: local!data[fv!index]<>ri!data[fv!index],
                      icon: "edit",
                      size: "MEDIUM",
                      color: "NEGATIVE"
                    )
                  )
                }
              )
            )
          )
        }
      ),
      a!columnLayout()
    }
  )
)

Test, and when you change any if the values, you will see a red icon appear in the "Edited" column:

Hi chrish, Thanks for the response

I have implemented similar functionality. Highlighted all fields in the row with color whenever there is a change in the data points. I just want to check if there is any Appian functionality that can highlight the entire row.


Thanks

Unfortunately we do not have the capability within a!gridLayout() to highlight specific rows at this time.

He mentioned in his reply to me that the main grid is read-only, and upon double checking, it does seem like we can utilize selected-row-highlighting while selection is plainly disabled.

That is an interesting theory, to spoof the row selection to take advantage of selectionStyle ROW_HIGHLIGHT (which I admittedly do not use often).

Same sample setup as my post above, swap this in for the main interface, you can check for differences right in the selectionValue parameter:

a!localVariables(
  local!data: a!refreshVariable(
    value: ri!data,
    refreshOnReferencedVarChange: false
  ),

  a!columnsLayout(
    columns: {
      a!columnLayout(),
      a!columnLayout(
        contents: {
          a!gridLayout(
            headerCells: a!forEach(items: {"Col 1","Col 2","Col 3"}, expression: a!gridLayoutHeaderCell(label: fv!item)),
            selectable: true,
            selectionValue: fn!reject(
              fn!isnull,
               a!forEach(
                 items: local!data,
                 expression: if(
                   fv!item<>ri!data[fv!index],
                   fv!index,
                   null
                 )
               )
            ),
            selectionStyle: "ROW_HIGHLIGHT",
            rows: a!forEach(
              items: ri!data,
              expression: a!gridRowLayout(
                id: fv!index,
                contents: {
                  a!textField(
                    value: fv!item.field1,
                    saveInto: ri!data[fv!index].field1
                  ),
                  a!textField(
                    value: fv!item.field2,
                    saveInto: ri!data[fv!index].field2
                  ),
                  a!textField(
                    value: fv!item.field3,
                    saveInto: ri!data[fv!index].field3
                  )
                }
              )
            )
          )
        }
      ),
      a!columnLayout()
    }
  )
)

Yeah, i'd verified myself with a tiny test interface first - this one is stupid simple by comparison of course.  OP would need to beef this up quite a bit to fill their use case but probably very doable - though it might start looking cluttery with various row highlights enabled.

a!gridField(
  data: {
    {name: "mike", id: 1},
    {name: "chris", id: 2}
  },
  
  columns: {
    a!gridColumn(value: fv!row.name)
  },
  selectionStyle: "ROW_HIGHLIGHT",
  selectable: true(),
  disableRowSelectionWhen: true(),
  selectionValue: {2}
)

Yeah, i'd verified myself with a tiny test interface first - this one is stupid simple by comparison of course.  OP would need to beef this up quite a bit to fill their use case but probably very doable - though it might start looking cluttery with various row highlights enabled.

a!gridField(
  data: {
    {name: "mike", id: 1},
    {name: "chris", id: 2}
  },
  
  columns: {
    a!gridColumn(value: fv!row.name)
  },
  selectionStyle: "ROW_HIGHLIGHT",
  selectable: true(),
  disableRowSelectionWhen: true(),
  selectionValue: {2}
)