Inline editable grid row save/update in DB

Question

I have an interface with editable grid (text fields marked READ ONLY = true ) as shown below: 
 
 I am trying to change READ ONLY = false on PENCIL icon click (as shown below) for first name, last name & email text fields show that I can update the values and save/update in the DB. 
 
 Please help me on this.

Mike Schmitt · Accepted Answer

The standard way would be to save the entire Rule Input CDT array into a process variable, then write that to the DB using a standard WTDS node. You would just pass in the whole array, as values that have not been updated will remain the same, and values that have been updated will overwrite with the new data. You can generally do it this way unless you have specific reasons not to.

Mike Schmitt · Answer

The way I usually handle this is by declaring a row-specific local variable to handle the current editability status, along the lines of: 
 rows: a!forEach(
 items: local!apidata,
 expression: a!localVariables(
 
 local!isEditable: false(),
 
 a!gridRowLayout(
 contents: {
 a!textField(
 label: "Id",
 labelPosition: "ABOVE",
 value: fv!item.id,
 saveInto: fv!item.id,
 refreshAfter: "UNFOCUS",
 readOnly: not(local!isEditable), /* note: usually you wouldn't allow an end user to edit a primary key ID, if that's what this is */
 disabled: false,
 validations: {}
 ),
 a!textField(
 label: "first_name",
 labelPosition: "ABOVE",
 value: fv!item.first_name,
 saveInto: fv!item.first_name,
 refreshAfter: "UNFOCUS",
 readOnly: not(local!isEditable),
 validations: {}
 ),
 a!textField(
 label: "last_name",
 labelPosition: "ABOVE",
 value: fv!item.last_name,
 saveInto: fv!item.last_name,
 refreshAfter: "UNFOCUS",
 readOnly: not(local!isEditable),
 validations: {}
 ),
 a!textField(
 label: "email",
 labelPosition: "ABOVE",
 value: fv!item.email,
 saveInto: fv!item.email,
 refreshAfter: "UNFOCUS",
 readOnly: not(local!isEditable),
 validations: {}
 ),
 a!richTextDisplayField(
 label: "icon",
 labelPosition: "JUSTIFIED",
 value: {
 a!richTextIcon(
 icon: "pencil",
 showWhen: not(local!isEditable),
 altText: "Update",
 caption: "",
 link: a!dynamicLink(
 /* label: "Dynamic Link", */ /* (not needed) */
 saveInto: {
 a!save(
 local!isEditable,
 true()
 )
 }
 ),
 color: "#3c78d8"
 ),
 a!richTextIcon(
 icon: "save",
 showWhen: local!isEditable,
 caption: "Save",
 link: a!dynamicLink(
 saveInto: {
 a!save(
 local!isEditable,
 false()
 )
 }
 )
 )
 }
 )
 }
 )
 )
)

Mike Schmitt · Answer

I basically answered your question already in the (2 1/2 year old) comment you're replying to here. 
 To rephrase some, the "standard" way of writing altered data to the DB is to pass it out in to a PV and write it in the process (you can also write it directly on-form, however this is slightly less recommended as a best practice due to being harder to troubleshoot / monitor / diagnose). 
 Assuming you want to proceed with the "write it in the process" approach, you will have the extra step of saving the value in your edited local!gdata array back into a Rule Input on your interface (like via the "submit" button), then in the process model you would (as always) need to map that Rule Input to an ACP (aka node input variable) of the correct CDT type, and set that ACP to save into a PV of the same type. Then once the form is successfully submitted you should find that your data has transferred into that PV, which you can make the target of a standard WTDS node.

Inline editable grid row save/update in DB

Top Replies