Interface, grid validations

RE: Interface, grid validations

Mike Schmitt — Tue, 14 Feb 2023 15:27:52 GMT

You can have that saveInto anywhere you need it to be, including in the navigation controls when the user is going to the next tab. It's hard for me to guess what your navigation pattern and advanced requirements are since these weren't mentioned earlier or included in the sample code. But in general it's very doable.

RE: Interface, grid validations

swapnar6405 — Tue, 14 Feb 2023 15:17:49 GMT

I am using the milestoneField componenet in the main interface and I am using above defined interface for one of the tab. So, I don't have Cancel & Submit buttons in the individual form. In the above code screen shot, we are saving local variable data to rule input inside the "Submit" button. That is where my issue is.

RE: Interface, grid validations

Mike Schmitt — Tue, 14 Feb 2023 15:03:50 GMT

Hi,

I included that in the example code I posted above, and mentioned it in my comment.

In other words, you'll un-comment the rule input there, and get rid of local!exampleOutput completely.

RE: Interface, grid validations

swapnar6405 — Tue, 14 Feb 2023 01:28:16 GMT

Hi Mike,

We are storing the data in a local variable. I am unable to pass this local variable data to a process Model. Because I am using this interface inside a milestoneField along with other interfaces.

How I can save local variable data into the rule input so that I can pass data to Process Model and save further into a database.

Thanks.

RE: Interface, grid validations

swapnar6405 — Mon, 13 Feb 2023 21:55:57 GMT

Great help Mike.

Really appreciate your help.

RE: Interface, grid validations

Mike Schmitt — Mon, 13 Feb 2023 21:14:49 GMT

I made you a fixed example (with stuff slightly reworked to not require the rules / constant on your environment) which handles the saving of the local array into the rule input in the appropriate place (in the submit button) and properly handles intialization of the local array / etc.

(note I turned of the requiredness of the file upload field temporarily just to allow easier testing of the saveinto on the submit button click, which for now saves into a fake local variable called "exampleOutput", but in your real interface you'll change to save back into your Rule Input array).

a!localVariables(
  local!documentTypes: {
    {
      description: "doc 1",
      documenttypekey: 1
    },
    {
      description: "doc 2",
      documenttypekey: 2
    }
  },
  /*rule!LCM_getDocumentTypes(documentTypeKey: null()),*/
  local!intakedocuments: {},
  local!itemscount: count(local!intakedocuments),

  local!blankRow: 
  /*'type!{urn:com:appian:types:LCM}LCM_IntakeDocuments'(),*/
  a!map(
    DocKey: null(),
    IntakeHeaderKey: null(),
    documentid: null(),
    documenttitle: "",
    documenttypekey: null(),
    uploadedby: loggedInUser(),
    dateuploaded: now()
  ),
  
  local!exampleOutput: {},

  a!formLayout(
    label: "Document Details",
    contents: {
      a!gridLayout(
        totalCount: count(local!intakedocuments),
        headerCells: {
          a!gridLayoutHeaderCell(label: "Document Type"),
          a!gridLayoutHeaderCell(label: "Document Title"),
          a!gridLayoutHeaderCell(label: "Document"),
          /* For the "Remove" column */
          a!gridLayoutHeaderCell(label: "")
        },
        columnConfigs: {
          a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 1),
          a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 1),
          a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 1),
          a!gridLayoutColumnConfig(width: "ICON")
        },
        rows: a!forEach(
          items: local!intakedocuments,
          expression: a!gridRowLayout(
            id: fv!index,
            contents: {
              a!dropdownField(
                label: "DocumentType " & fv!index,
                placeholder: "-- Select -- ",
                choiceLabels: index(local!documentTypes, "description", ""),
                choiceValues: index(
                  local!documentTypes,
                  "documenttypekey",
                  ""
                ),
                value: fv!item.documenttypekey,
                saveInto: {
                  fv!item.documenttypekey,
                  /*a!save(*/
                    /*ri!lcmIntakeDocuments,*/
                    /*a!forEach(*/
                      /*items: local!intakedocuments,*/
                      /*expression: {*/
                        /*documentid: fv!item.documentid,*/
                        /*documenttitle: fv!item.documenttitle,*/
                        /*documenttypekey: fv!item.documenttypekey,*/
                        /*uploadedby: loggedInUser(),*/
                        /*dateuploaded: now()*/
                      /*}*/
                    /*)*/
                  /*)*/
                },
                required: if(
                  or(
                    a!isNotNullOrEmpty(fv!item.documenttitle),
                    a!isNotNullOrEmpty(fv!item.documentid)
                  ),
                  true(),
                  false()
                )
              ),
              a!textField(
                label: "DocumentTitle" & fv!index,
                value: fv!item.documenttitle,
                saveInto: {
                  fv!item.documenttitle,
                  /*a!save(*/
                    /*ri!lcmIntakeDocuments,*/
                    /*a!forEach(*/
                      /*items: local!intakedocuments,*/
                      /*expression: {*/
                        /*documentid: fv!item.documentid,*/
                        /*documenttitle: fv!item.documenttitle,*/
                        /*documenttypekey: fv!item.documenttypekey,*/
                        /*uploadedby: loggedInUser(),*/
                        /*dateuploaded: now()*/
                      /*}*/
                    /*)*/
                  /*)*/
                },
                required: if(
                  or(
                    a!isNotNullOrEmpty(fv!item.documenttypekey),
                    a!isNotNullOrEmpty(fv!item.documentid)
                  ),
                  true(),
                  false()
                )
              ),
              a!fileUploadField(
                label: "Attach LCM Document(s)" & fv!index,
                /*target: cons!LCMDOCUMENTS,*/
                maxSelections: 1,
                value: fv!item.documentid,
                saveInto: {
                  fv!item.DocumentID,
                  /*a!save(*/
                    /*ri!lcmIntakeDocuments,*/
                    /*a!forEach(*/
                      /*items: local!intakedocuments,*/
                      /*expression: {*/
                        /*documentid: fv!item.documentid,*/
                        /*documenttitle: fv!item.documenttitle,*/
                        /*documenttypekey: fv!item.documenttypekey,*/
                        /*uploadedby: loggedInUser(),*/
                        /*dateuploaded: now()*/
                      /*}*/
                    /*)*/
                  /*)*/
                },
                buttonStyle: "STANDARD",
                required: if(
                  or(
                    a!isNotNullOrEmpty(fv!item.documenttypekey),
                    a!isNotNullOrEmpty(fv!item.documenttitle)
                  ),
                  /*true(),*/ false(),
                  false()
                )
              ),
              /* For the Removal Column*/
              a!richTextDisplayField(
                value: a!richTextIcon(
                  icon: "close",
                  altText: "Delete ",
                  caption: "Delete ",
                  link: a!dynamicLink(
                    value: fv!index,
                    saveInto: {
                      a!save(
                        local!intakedocuments,
                        remove(local!intakedocuments, save!value)
                      ),
                      /*a!save(*/
                        /*ri!lcmIntakeDocuments,*/
                        /*remove(ri!lcmIntakeDocuments, save!value)*/
                      /*)*/
                    },

                  ),
                  linkStyle: "STANDALONE",
                  color: "NEGATIVE"
                )
              )
            }
          )
        ),
        addRowlink: a!dynamicLink(
          label: "Add Document",
          saveInto: {
            a!save(
              local!intakedocuments,
              append(local!intakedocuments, local!blankRow),

            ),
            /*a!save(*/
              /*local!itemscount,*/
              /*count(ri!lcmIntakeDocuments)*/
            /*)*/
          }
        ),
        spacing: "DENSE",
        rowHeader: 1
      )
    },
    buttons: a!buttonLayout(
      primaryButtons: {
        a!buttonWidget(
          label: "Submit" & local!itemscount,
          submit: true,
          style: "PRIMARY",
          saveInto: {
            a!save(
              /*ri!lcmIntakeDocuments,*/ local!exampleOutput,
              a!forEach(
                items: local!intakedocuments,
                expression: {
                  documentid: fv!item.documentid,
                  documenttitle: fv!item.documenttitle,
                  documenttypekey: fv!item.documenttypekey,
                  uploadedby: loggedInUser(),
                  dateuploaded: now()
                }
              )
            )
          }
        )
      },
      secondaryButtons: {
        a!buttonWidget(
          label: "Cancel",
          value: true,
          /*saveInto: ri!cancel,*/
          submit: true(),
          style: "NORMAL",
          validate: false
        )
      }
    )
  )
)

Let me know if any questions.

RE: Interface, grid validations

Mike Schmitt — Mon, 13 Feb 2023 21:07:11 GMT

Also, sorry i didn't notice this before - you'll have to rework your saveIntos to remove this. This won't work the way you think it will. You should be relying on the individual fields to save their own properties into the CDT.

RE: Interface, grid validations

Mike Schmitt — Mon, 13 Feb 2023 21:02:22 GMT

You'll also want to replace this "save!value" (which is empty) with your CDT type declaration. This will mean you're appending one row containing that empty CDT (instead of null) to the end of the array (which, when the array is starting blank, will mean it's just an array of a single empty copy of htat CDT, which is what you'llw ant).

RE: Interface, grid validations

swapnar6405 — Mon, 13 Feb 2023 20:59:37 GMT

Even after using empty set {}, I am getting same error.

This error is occuring, then I try to add a new row by clicking on "add" link and after selecting an item in the first column drop down element value.

RE: Interface, grid validations

Mike Schmitt — Mon, 13 Feb 2023 20:55:06 GMT

You need to initialize local!intakedocuments as an empty set ({}), not null. The a!forEach() function properly handles an empty set, but if you pass a value of null(), it'll assume that's an actual (empty) row with invalid properties, producing the error you're seeing.

RE: Interface, grid validations

swapnar6405 — Mon, 13 Feb 2023 20:45:49 GMT

Test code

RE: Interface, grid validations

Mike Schmitt — Mon, 13 Feb 2023 20:43:13 GMT

Please share a code snippet - there's something you're not initializing correctly, but it's hard to tell based only on front-end screenshots 🙂

RE: Interface, grid validations

swapnar6405 — Mon, 13 Feb 2023 20:40:17 GMT

When I try to show an empty grid initially when the page/interface load and if I try to add a new row when user clicks on "add", I am getting an error message

"Could not display interface. Please check definition and inputs. Interface Definition: Expression evaluation error [evaluation ID = 59651:353c2] : An error occurred while executing a save: java.lang.IllegalArgumentException: Invalid index: Cannot index property 'documenttype' into type List of Null"

RE: Interface, grid validations

Mike Schmitt — Mon, 13 Feb 2023 20:32:27 GMT

[quote userid="170215" url="~/discussions/f/user-interface/27742/interface-grid-validations/107890#107890"]if any of the row (All elements) left empty and try to submit the form, then I would like to provide validation.[/quote]

Setting the "required" parameter on any / all of the fields should accomplish this. Generally I recommend you stick to this approach unless you have strong reasoning to do otherwise.

[quote userid="170215" url="~/discussions/f/user-interface/27742/interface-grid-validations/107890#107890"]Is it mandatory to show at least one row in the editable grid?[/quote]

No. If you want to start out with an empty grid (until the user clicks "add"), you should make sure to pass in an empty set as your initial CDT value.

RE: Interface, grid validations

swapnar6405 — Mon, 13 Feb 2023 20:30:41 GMT

I mean, if any of the row (All elements) left empty and try to submit the form, then I would like to provide validation.

Not sure how to handle this.

Also, by default, I am showing one row with all the three elements. Is it mandatory to show at least one row in the editable grid?

RE: Interface, grid validations

Mike Schmitt — Mon, 13 Feb 2023 20:27:30 GMT

Can you specify what you mean exaclty by "entire row is empty"? What would the validation condition be exactly / what would you want to show the user / what would you hope the user does differently? Generally, when a row is added and you make all 3 of the column-fields required, when they attempt to "submit", the item-by-item 'required' messages will show.

RE: Interface, grid validations

swapnar6405 — Mon, 13 Feb 2023 20:22:41 GMT

Thanks Mike for providing an idea to handle the validations in this scenario..

Is there away we can handle if entire row is empty. Is it advisable to handle at grid level or something at Process Model smart node level?

RE: Interface, grid validations

Mike Schmitt — Mon, 13 Feb 2023 19:34:47 GMT

The "required" setting for the Title text entry would need to be based on that row's document Type selection - at the moment you're basing it on the value of the entire array, which won't really work well. It should be something along the lines of "fv!item.documentType" in your example. Basically the same thing that you're (hopefully) saving the row-specific document type value into.