Radio Button

When i want to click on radio button then it displays the below selection layout

  Discussion posts and replies are publicly visible

  • Hi , can you please tell what exactly is happening? Are you getting any error?
  • 0
    A Score Level 1
    in reply to Harsha
    Could not display interface. Please check definition and inputs.
    Interface Definition: Expression evaluation error at function a!formLayout [line 125]: Invalid index: Cannot index property 'Challan' of type Text into type List of Text String
  • 0
    A Score Level 1
    in reply to Narmada
    I have taken one radio button named payment type & first button named online second button named Challan when i want to click on challan button i want to display below selection layout
  • I am attaching a sample code to achieve the same. Refer this and share your code if you are having any trouble after this.

      a!formLayout(
      label: "",
      contents: {
        a!sectionLayout(
          label: "",
          contents: {
            a!radioButtonField(
              label: "Payment Type",
              labelPosition: "ABOVE",
              choiceLabels: {"Online", "Challan"},
              choiceValues: {1, 2},
              value:ri!val,
              saveInto:ri!val,
              choiceLayout: "STACKED",
              validations: {}
            )
            
          }
        ),
       if(ri!val=2,
         a!columnsLayout(
          columns: {
            a!columnLayout(
              contents: {
                a!sectionLayout(
                  label: "Lorem Ipsum",
                  contents: {
                    a!textField(
                      label: "Lorem Ipsum",
                      labelPosition: "ABOVE",
                      saveInto: {},
                      refreshAfter: "UNFOCUS",
                      validations: {}
                    )
                  }
                )
              }
            ),
            a!columnLayout(
              contents: {
                a!sectionLayout(
                  label: "Lorem Ipsum",
                  contents: {
                    a!textField(
                      label: "Lorem Ipsum",
                      labelPosition: "ABOVE",
                      saveInto: {},
                      refreshAfter: "UNFOCUS",
                      validations: {}
                    )
                  }
                )
              }
            )
          }
        ),{})
      }
    )

  • 0
    Certified Lead Developer
    , If you can attach your code it would easy to understand the issue.
  • 0
    A Score Level 1
    in reply to Rama Thummala
    a!formLayout(
    label: "Payment",
    contents: {
    a!radioButtonField(
    label: "Payment Type",
    labelPosition: "ADJACENT",
    choiceLabels: {"Online", "Bank Challan"},
    choiceValues: {"Online", "Bank Challan"},
    value: ri!Pay_Type,
    saveInto: ri!Pay_Type,
    choiceLayout: "COMPACT",
    validations: {}
    ),
    a!sectionLayout(
    label: "Passport Seva Challan",
    contents: {
    a!columnsLayout(
    columns:{
    a!columnLayout(
    contents:{
    a!textField(
    label: "SBI CBS Screen No:",
    labelPosition: "ADJACENT",
    value: ri!ScreenNo,
    saveInto: ri!ScreenNo,
    refreshAfter: "UNFOCUS",
    validations: {}
    )
    }
    ),
    a!columnLayout(
    contents:{
    a!textField(
    label: "Fee Type",
    labelPosition: "ADJACENT",
    value: ri!FeeType,
    saveInto: ri!FeeType,
    refreshAfter: "UNFOCUS",
    validations: {}
    )
    }
    )
    }
    ),
    a!textField(
    label: "Challan Number",
    labelPosition: "ADJACENT",
    value: ri!ChallanNo,
    saveInto: ri!ChallanNo,
    refreshAfter: "UNFOCUS",
    validations: {}
    ),
    a!textField(
    label: "Challan Expiry Date",
    labelPosition: "ADJACENT",
    value: ri!ChallanDate,
    saveInto: ri!ChallanDate,
    refreshAfter: "UNFOCUS",
    validations: {}
    ),
    a!textField(
    label: "Passport Office",
    labelPosition: "ADJACENT",
    value: ri!PassportOffice,
    saveInto: ri!PassportOffice,
    refreshAfter: "UNFOCUS",
    validations: {}
    ),
    a!textField(
    label: "Passport Service Type",
    labelPosition: "ADJACENT",
    value: ri!PassportServiceType,
    saveInto: ri!PassportServiceType,
    refreshAfter: "UNFOCUS",
    validations: {}
    ),
    a!textField(
    label: "Applicant Name",
    labelPosition: "ADJACENT",
    value: ri!ApplicantName,
    saveInto: ri!ApplicantName,
    refreshAfter: "UNFOCUS",
    validations: {}
    ),
    a!textField(
    label: "Contact Number",
    labelPosition: "ADJACENT",
    value: ri!PhoneNumber,
    saveInto: ri!PhoneNumber,
    refreshAfter: "UNFOCUS",
    validations: {}
    ),
    a!integerField(
    label: "Amount",
    labelPosition: "ADJACENT",
    value: ri!Amount,
    saveInto: ri!Amount,
    refreshAfter: "UNFOCUS",
    validations: {}
    ),
    a!textField(
    label: "Signature",
    labelPosition: "ADJACENT",
    value: ri!Sign,
    saveInto: ri!Sign,
    refreshAfter: "UNFOCUS",
    validations: {}
    ),
    a!paragraphField(
    label: "Instructions",
    labelPosition: "ADJACENT",
    placeholder: "1)Payment after challange expiry date will be rejected by Bank
    2)Deposit the application fee at nearest SBI branch after be least 3 hours from generating the challan",
    value: ri!Instructions,
    saveInto: ri!Instructions,
    refreshAfter: "UNFOCUS",
    requiredmessage: "",
    readOnly: true,
    height: "SHORT",
    validations: {}
    )
    },
    showwhen: true),
    a!sectionLayout(
    contents: {
    a!radioButtonField(
    label: "Card Type",
    labelPosition: "ADJACENT",
    choiceLabels: {"Master Card", "Visa","Paypal","American Express"},
    choiceValues: {"Master Card", "Visa","Paypal","American Express"}
    ,
    value: ri!CardType,
    saveInto: ri!CardType,
    showwhen: if(ri!Pay_Type<>null,"",null),
    choiceLayout: "COMPACT",
    validations: {}
    ),
    a!textField(
    label: "Name on card",
    labelPosition: "ADJACENT",
    value: ri!Name,
    saveInto: ri!Name,
    refreshAfter: "UNFOCUS",
    validations: {}
    ),
    a!textField(
    label: "Card Number",
    labelPosition: "ADJACENT",
    value: ri!CardNumber,
    saveInto: ri!CardNumber,
    refreshAfter: "UNFOCUS",
    validations: {}
    ),
    a!dateField(
    label: "Expiry Date",
    labelPosition: "ADJACENT",
    value: ri!Date,
    saveInto: ri!Date,
    validations: {}
    ),
    a!textField(
    label: "CVV",
    labelPosition: "ADJACENT",
    value:ri!CVV,
    saveInto: ri!CVV,
    refreshAfter: "UNFOCUS",
    validations: {}
    )
    },
    showwhen: {}
    )
    /*showWhen: isnull(*/
    /*ri!Pay_Type.challan*/
    /*),*/
    /*Showwhen:ri!Pay_Type="BankChallan",*/


    },

    buttons: a!buttonLayout(
    primaryButtons: {
    a!buttonWidgetSubmit(
    label: "Submit",
    style: "PRIMARY"
    )
    }
    )
    )
  • I am assuming ri!Pay_Type is of type text. If its true, then just add the showWhen attribute with value as ri!Pay_Type="Bank Challan" in the sectionLayout(). I see in the commented part of the section you have "BankChallan" without any space.
    Are you still getting the error you mentioned above? In the Card Type radio button field try changing the showWhen as not(isnull(ri!Pay_Type)) instead of if(). Hope it helps.
  • Hi narmadap,
    I have added one line of code for section Layout like Show-when Condition showwhen: ri!Pay_Type="Bank Challan".



    load(
    local!showWhen,
    a!formLayout(
    label: "Payment",
    contents: {
    a!radioButtonField(
    label: "Payment Type",
    labelPosition: "ADJACENT",
    choiceLabels: {
    "Online",
    "Bank Challan"
    },
    choiceValues: {
    "Online",
    "Bank Challan"
    },
    value: ri!Pay_Type,
    saveInto:
    ri!Pay_Type

    ,
    choiceLayout: "COMPACT",
    validations: {}
    ),
    a!sectionLayout(
    label: "Passport Seva Challan",
    contents: {
    a!columnsLayout(
    columns: {
    a!columnLayout(
    contents: {
    a!textField(
    label: "SBI CBS Screen No:",
    labelPosition: "ADJACENT",
    value: ri!ScreenNo,
    saveInto: ri!ScreenNo,
    refreshAfter: "UNFOCUS",
    validations: {}
    )
    }
    ),
    a!columnLayout(
    contents: {
    a!textField(
    label: "Fee Type",
    labelPosition: "ADJACENT",
    value: ri!FeeType,
    saveInto: ri!FeeType,
    refreshAfter: "UNFOCUS",
    validations: {}
    )
    }
    )
    }
    ),
    a!textField(
    label: "Challan Number",
    labelPosition: "ADJACENT",
    value: ri!ChallanNo,
    saveInto: ri!ChallanNo,
    refreshAfter: "UNFOCUS",
    validations: {}
    ),
    a!textField(
    label: "Challan Expiry Date",
    labelPosition: "ADJACENT",
    value: ri!ChallanDate,
    saveInto: ri!ChallanDate,
    refreshAfter: "UNFOCUS",
    validations: {}
    ),
    a!textField(
    label: "Passport Office",
    labelPosition: "ADJACENT",
    value: ri!PassportOffice,
    saveInto: ri!PassportOffice,
    refreshAfter: "UNFOCUS",
    validations: {}
    ),
    a!textField(
    label: "Passport Service Type",
    labelPosition: "ADJACENT",
    value: ri!PassportServiceType,
    saveInto: ri!PassportServiceType,
    refreshAfter: "UNFOCUS",
    validations: {}
    ),
    a!textField(
    label: "Applicant Name",
    labelPosition: "ADJACENT",
    value: ri!ApplicantName,
    saveInto: ri!ApplicantName,
    refreshAfter: "UNFOCUS",
    validations: {}
    ),
    a!textField(
    label: "Contact Number",
    labelPosition: "ADJACENT",
    value: ri!PhoneNumber,
    saveInto: ri!PhoneNumber,
    refreshAfter: "UNFOCUS",
    validations: {}
    ),
    a!integerField(
    label: "Amount",
    labelPosition: "ADJACENT",
    value: ri!Amount,
    saveInto: ri!Amount,
    refreshAfter: "UNFOCUS",
    validations: {}
    ),
    a!textField(
    label: "Signature",
    labelPosition: "ADJACENT",
    value: ri!Sign,
    saveInto: ri!Sign,
    refreshAfter: "UNFOCUS",
    validations: {}
    ),
    a!paragraphField(
    label: "Instructions",
    labelPosition: "ADJACENT",
    placeholder: "1)Payment after challange expiry date will be rejected by Bank
    2)Deposit the application fee at nearest SBI branch after be least 3 hours from generating the challan",
    value: ri!Instructions,
    saveInto: ri!Instructions,
    refreshAfter: "UNFOCUS",
    requiredmessage: "",
    readOnly: true,
    height: "SHORT",
    validations: {}
    )
    },
    showwhen: ri!Pay_Type="Bank Challan"
    ),
    a!sectionLayout(
    contents: {
    a!radioButtonField(
    label: "Card Type",
    labelPosition: "ADJACENT",
    choiceLabels: {
    "Master Card",
    "Visa",
    "Paypal",
    "American Express"
    },
    choiceValues: {
    "Master Card",
    "Visa",
    "Paypal",
    "American Express"
    },
    value: ri!CardType,
    saveInto: ri!CardType,
    showwhen: if(
    ri!Pay_Type <> null,
    "",
    null
    ),
    choiceLayout: "COMPACT",
    validations: {}
    ),
    a!textField(
    label: "Name on card",
    labelPosition: "ADJACENT",
    value: ri!Name,
    saveInto: ri!Name,
    refreshAfter: "UNFOCUS",
    validations: {}
    ),
    a!textField(
    label: "Card Number",
    labelPosition: "ADJACENT",
    value: ri!CardNumber,
    saveInto: ri!CardNumber,
    refreshAfter: "UNFOCUS",
    validations: {}
    ),
    a!dateField(
    label: "Expiry Date",
    labelPosition: "ADJACENT",
    value: ri!Date,
    saveInto: ri!Date,
    validations: {}
    ),
    a!textField(
    label: "CVV",
    labelPosition: "ADJACENT",
    value: ri!CVV,
    saveInto: ri!CVV,
    refreshAfter: "UNFOCUS",
    validations: {}
    )
    },
    showwhen: {}
    )/*showWhen: isnull(*/
    /*ri!Pay_Type.challan*/
    /*),*/
    /*Showwhen:ri!Pay_Type="BankChallan",*/

    },
    buttons: a!buttonLayout(
    primaryButtons: {
    a!buttonWidgetSubmit(
    label: "Submit",
    style: "PRIMARY"
    )
    }
    )
    )
    )

    I hope this will help you.