Skip to main content
jaredd697065
jaredd697065
September 20, 2021
Question

Add Icon to Unlock All Rows for Editing

  • September 20, 2021
  • 3 replies
  • 0 views

Hi everyone. We are building a grid with data records in it. What we want to do is add a button above the grid, that when clicked, will unlock all the rows for editing and when clicked again will lock the rows. In other words, if a user clicks the button, all the fields will turn into text fields and if clicked again the fields would go back to read-only.  

Any suggestions for how to go about this? 

3 replies

vimals
vimals
September 20, 2021

jaredd0001,

Have a local variable gridDataReadOnly. Use this in all the Gride Row Fields - read-only Parameter and set the value for this local variable using the button click 

vimals
vimals
September 20, 2021

If you are looking for a sample code

a!localVariables(
  local!gridDataReadOnly: true(),
  {
  a!buttonArrayLayout(
    buttons: {
      a!buttonWidget(
        label: "Save Edit",
        saveInto: {
          a!save(local!gridDataReadOnly, true)
        },
        style: "NORMAL",
        showWhen: local!gridDataReadOnly=false()
      ),

      a!buttonWidget(
        label: "Edit",
        saveInto: {
          a!save(local!gridDataReadOnly, false)
        },
        style: "NORMAL",
        showWhen: local!gridDataReadOnly<>false()
      )
    },
    align: "START"
  ),
  a!gridLayout(
    labelPosition: "ABOVE",
    headerCells: {
      a!gridLayoutHeaderCell(label: "Header Cell"),
      a!gridLayoutHeaderCell(
        label: "Header Cell"
      )
    },
    columnConfigs: {},
    rows: {
      a!gridRowLayout(
        contents: {
          a!textField(
            label: "Text",
            labelPosition: "ABOVE",
            value: "Text Field",
            saveInto: {},
            refreshAfter: "UNFOCUS",
            readOnly: local!gridDataReadOnly,
            validations: {}
          ),
          a!dropdownField(
            label: "Dropdown",
            labelPosition: "ABOVE",
            placeholder: "--- Select a Value ---",
            choiceLabels: {"Option 1", "Option 2", "Option 3", "Option 4",
                            "Option 5", "Option 6", "Option 7", "Option 8",
                            "Option 9", "Option 10", "Option 11", "Option 12"},
            choiceValues: {1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12},
            saveInto: {},
            searchDisplay: "AUTO",
            disabled: local!gridDataReadOnly,
            validations: {}
          )
        }
      )
    },
    selectionSaveInto: {},
    validations: {},
    shadeAlternateRows: true
  )
})

Terms & ConditionsAccessibility statement