Saving user input values in cdts from the editable grid

Certified Lead Developer

Hi,

I have editable grid having two columns one is readonly field for showing label and in the second column the user will enter the data. The data for this columns is getting from a local variable . The user can delete the rows and he add row upto 5 rows.

Now I have a cdt with fields like r1, r2, r3, r4, r5. Now I want to map the data entered by the user to cdt.

  Discussion posts and replies are publicly visible

  • You can just a!save() into the CDT with the local! values like below:

    a!save(ri!CDT.field, index(local!data, "fieldName", null)) <-- you may need an additional level of indexing if the data is nested and/or use type casting if the data types would differ

    You could also build an expression rule, that would be applied over using apply(), to construct the data into the given CDT and save it all in one shot (assuming this is when they submit the form, in a 'saveInto', use the examples below:

    --Rule being used/referenced--
    a!save(
    ri!cdtName,
    apply(
    rule!AppName_buildCDTName(_),
    local!varName /* <---This is assuming you're saving all the user's entries into a single variable */
    )

    --Within rule!AppName_buildCDTName--
    'type!{namespace}CDTName'(
    r1:index(ri!varName, "fieldName", null),
    r2:index(ri!varName, "fieldName", null),
    r3:index(ri!varName, "fieldName", null),
    r4:index(ri!varName, "fieldName", null),
    r5:index(ri!varName, "fieldName", null)
    )

    Note: Don't forget null checks on the a!save()

    You may also have to do some tinkering with the above code, but the options above should generally give you what you want. If you want a more precise answer, please provide the data structure of your local variable after the user has saved X entries.

  • 0
    Certified Lead Developer
    in reply to Reggie

    my local variable:

    local!data: {

       {

         id: 1,

         label: "r1",

         value: ""

       },

       {

         id: 2,

         label: "r2",

         value: ""

       }

     },

    The data entered by user will be inserted into value parameter of the local variable.

    And eventually the data need to be entered to particular field of cdt.

    Is it possible or can anyone suggest what should be the structure of cdt to save the data.

  • 0
    A Score Level 2
    in reply to santoshd378

    Santosh, could you tell me if my assumptions below are correct?

    1. ID is just an auto-generated number which would serve as the identifier in a grid
    2. A label is just context to the value. In other words, the label tells the user what the value is for.
    3. Value is provided by the user which could be anything(?)

  • 0
    Certified Lead Developer
    in reply to Reggie

    Yes, id is an identifier,
    In my editable grid there will be two columns, in 1st column just label will be displayed and in second column a text box will be provided to save the value.

  • 0
    Certified Lead Developer
    in reply to santoshd378

    This is a fairly straightforward case for an editable grid.  If you're using 17.2 or above, you can also do it without even needing to declare a sub-rule (at least for starters).  See below example.

    load(
      
      local!data: {
        {
          id: 1,
          label: "r1",
          value: ""
        },
        {
          id: 2,
          label: "r2",
          value: ""
        }
      },
      
      a!sectionLayout(
        label: "Test Editable Grid",
        contents: {
          a!paragraphField(
            label: "DEBUG",
            showWhen: false(),
            value: local!data,
            disabled: true()
          ),
          
          a!gridLayout(
            headerCells: {
              a!gridLayoutHeaderCell(label: "Label"),
              a!gridLayoutHeaderCell(label: "Value")
            },
            rows: a!forEach(
              local!data,
              a!gridRowLayout(
                contents: {
                  a!textField(
                    value: fv!item.label,
                    readOnly: true()
                  ),
                  a!textField(
                    value: fv!item.value,
                    saveInto: fv!item.value
                  )
                }
              )
            ),
            addRowLink: if(
              length(local!data) < 5,
              a!dynamicLink(
                label: "Add Row",
                saveInto: a!save(
                  local!data,
                  append(
                    local!data,
                    {
                      id: max(local!data.id)+1,
                      label: "r" & max(local!data.id)+1,
                      value: null()
                    }
                  )
                )
              ),
              null()
            )
          )
        }
      )
    )

  • Hi,

    My requirement is to create dynamic sections with grid layout  based on the dropdown selection.
    Columns in grid:
    - Question(Read Only)
    - Order No (Editable) - On load ,the order no field is disabled.
    Once the row is selected, the order no field will be enabled and the value will be saved in cdt variable.

    I am facing issues when saving the order no values into cdt. Each row's order number field value overwrites when other row is selected. 

    Thanks in advance!

  • 0
    Certified Lead Developer
    in reply to chandhinir

    Interesting use case.  Some follow-up questions from me:

    1. What is the reasoning behind making the Order Number box editable only when the row is selected?  How do you plan to handle conflicts i.e. a user changes the "1" from your screenshot to "2", even though there already is a "2"?
    2. Have you considered implementing "move up / move down" links in their own column?  I've done this before and it's fairly easy - the "move" link for any particular row can automatically handling switching the "order number" values in the background with the preceding / following row (depending on which one is clicked), and removes some manual hassle from the user.  Now that we can use RichTextIcons, I believe you can have both in a single column if you want.
    3. Can you post some sample code?
  • Hi Mike,

    Thanks for your reply. Please find the answers below:

    1. Reason for order no: There will be a chance of having more questions related to same section.if i open up the order no for editing by default, might be difficult to identify which questions the user has selected.
      Only for the selected question,I need order no to be entered.same order no conflicts will be handled through validations in the order no field.
    2. I have not tried this approach.
    3. Can you post some sample code?

  • 0
    Certified Lead Developer
    in reply to chandhinir

    Thanks for your reply - before I dig into your code I have a suggestion/request - maybe you could edit your post and put your sample code in a Code box - use the "insert" tool on the toolbar of the editor then choose "insert code", and paste your code there instead - that allows it to maintain formatting as well as not extending your comment window to extreme lengths.  Thanks!