How to use required parameter in rich text display field?

Hello Everyone,

I am using rich text display field to capture ranting from user.

I want that field to be required and i am not able to figure it out how to do that.

Your help will be appreciated.

Below is the code i am using.

a!richTextDisplayField(

label: "Rating",
value: {
a!forEach(
items: enumerate(ri!totalStars),
expression: {
a!richTextIcon(
icon: if(
fv!index <= ri!rating,
"star",
"star-o"
),
link: a!dynamicLink(
value: if(ri!rating=fv!index, 0, fv!index),
saveInto: ri!rating
),
linkstyle: cons!MMS_DG_LINK_STYLE[2],
color: cons!MMS_DG_BOX_STYLE[2],
size: cons!MMS_DG_LINK_SIZE[1]
)
}
)
}
)

  Discussion posts and replies are publicly visible

  • 0
    Certified Lead Developer

    Try something like this.

    a!localVariables(
    {
    a!richTextDisplayField(
      showWhen: a!isNotNullOrEmpty(ri!rating),
      label: "Rating",
      value: {
        a!forEach(
          items: enumerate(ri!totalStars),
          expression: {
            a!richTextIcon(
              icon: if(
                fv!index <= ri!rating,
                "star",
                "star-o"
              ),
              link: a!dynamicLink(
                value: if(ri!rating=fv!index, 0, fv!index),
                saveInto: ri!rating
              )
              
            )
          }
        )
      }
    ),
    a!textField(
      showWhen: a!isNullOrEmpty(ri!rating),
      label: "Rating",
      value: "Rating parameter must be filled"
    )
    }
    )
    

  • 0
    Certified Senior Developer

      Try this once

    a!localVariables(
      {
        a!richTextDisplayField(
          label: "Rating",
          value: {
            a!forEach(
              items: enumerate(ri!totalStars),
              expression: {
                a!richTextIcon(
                  icon: if(fv!index <= ri!rating, "star", "star-o"),
                  link: a!dynamicLink(
                    value: if(ri!rating = fv!index, 0, fv!index),
                    saveInto: ri!rating
                  )
                )
              }
            )
          }
        ),
        a!richTextDisplayField(
          value: a!richTextItem(
            text: "Rating parameter must be filled, Please select a rating before submitting.",
            color: "NEGATIVE",
            style: "STRONG"
          ),
          showWhen: a!isNullOrEmpty(ri!rating),
          
        )
      }
    )

  • 0
    Certified Lead Developer

    The Rich Text Display Field of course does not have a "required" parameter as it is, ostensibly, a read-only input.  The fact that we can use links and differing stying and icons and fun stuff like that, in order to essentially transform Rich Text into an ad-hoc input, doesn't actually override the fact that no data is being inputted into the field, meaning there's nothing as easy as "use required parameter" to force the user into said action.

    The above responses will work, though (through only a quick glance) it looks like those ad-hoc validations will show up immediately and continue showing up until the value is entered, but also won't prevent a button click like a normal failed validation would.  This is where we can use a Section-level (or form-level) validation using a!validationMessage(), which has the unique ability to optionally be set to not evaluate its failure condition until Submit Click has been attempted by the user.

    A portable example with local-only variables is attached:

    a!localVariables(
      
      local!rating: tointeger(null()),
      local!totalStars: 7,
      
      
      a!sectionLayout(
        contents: {
          a!richTextDisplayField(
            /*showWhen: a!isNotNullOrEmpty(local!rating),*/
            label: "Rating",
            value: {
              a!forEach(
                items: enumerate(local!totalStars)+1,
                expression: {
                  a!richTextIcon(
                    size: "MEDIUM",
                    icon: if(
                      or(fv!index > local!rating, a!isNullOrEmpty(local!rating)),
                      "star-o",
                      "star"
                    ),
                    link: a!dynamicLink(
                      saveInto: {
                        a!save(
                          local!rating,
                          if(fv!item = local!rating, tointeger(null()), fv!item)
                        )
                      }
                    ),
                    linkStyle: "STANDALONE"
                  )
                }
              ),
              
              a!richTextItem(
                size: "SMALL",
                color: "NEGATIVE",
                text: {
                  char(10),
                  "(* Required)"
                }
              )
            }
          ),
          
          a!buttonArrayLayout(
            align: "CENTER",
            buttons: {
              a!buttonWidget(
                label: "SUBMIT",
                submit: true(),
                validate: true()
              )
            }
          )
        },
        
        validations: {
          a!validationMessage(
            message: "A rating is required.",
            showWhen: a!isNullOrEmpty(local!rating),
            validateAfter: "SUBMIT"
          )
        }
      )
    )

  • 0
    Certified Lead Developer

      One of the Approach would be to use Validation like as we will be storing the value at some place and By Default it will be null .

    Hence on Click of Button we can find if its still null it will display an error else we will Proceed . 

    Normal if else will Take care of Such .

    Another Approach would be to Disable the Button Until all the Values are not null .