Symantec IGA

 View Only
Expand all | Collapse all

Changing the multi-select value list based on other attribute in Form creation

Jump to Best Answer
  • 1.  Changing the multi-select value list based on other attribute in Form creation

    Posted Jan 02, 2019 10:28 AM

    Hi Everyone,

     

    We are trying to create a user friendly form for self service request by end users in CA Identity Portal.

     

    So the scenario is this,

    I have two attributes. The first attribute is a drop down list and the second attribute need to be a Multi-Select and the options for this multi-select will vary based on the selection of first attribute. Once a user chose an option for first attribute using the drop-down, then the option for the second attribute(a multi-select attribute) should be displayed in the form. Any thoughts/suggestions on this is highly helpful. Thanks much in advance!

     

    Note: Using the below article, I was able to come up with a form that has both these attributes as a drop-down list. The challenge here is to make the second attribute as multi-select.

    Hotel Reservation Form Example - CA Identity Portal - 14.1 - CA Technologies Documentation 

     

     

    Regards,

    V R



  • 2.  Re: Changing the multi-select value list based on other attribute in Form creation
    Best Answer

    Posted Jan 02, 2019 12:56 PM

    Hi,

     

    If I understand the use case correctly then the following example should work (it's quite similar to the example from the documentation you referred to):

    • Form with two properties, the first is a Drop-Down and the second a Multi Select List. 
    • Give the Multi Select List property a Reference Name (in the property's General tab) so you can modify it from the Drop-Down property. Let's assume this name is 'multiselect-ref-name'.
    • The Drop-Down property has three options: "Option 1", "Option 2" and "Option 3". 
    • In the Drop-Down property's Change Handler, add the following code:
      let multiSelectOptions;
      const firstValueOptions = [
          {name: 'Option 1 first option', value: 'Option 1 first option', description: 'first description'},
          {name: 'Option 1 second option', value: 'Option 1 second option', description: 'second description'},
          {name: 'Option 1 third option', value: 'Option 1 third option', description: 'third description'}
      ];
      const secondValueOptions = [
          {name: 'Option 2 first option', value: 'Option 2 first option', description: 'first description'},
          {name: 'Option 2 second option', value: 'Option 2 second option', description: 'second description'},
          {name: 'Option 2 third option', value: 'Option 2 third option', description: 'third description'}
      ];
      const thirdValueOptions = [
          {name: 'Option 3 first option', value: 'Option 3 first option', description: 'first description'},
          {name: 'Option 3 second option', value: 'Option 3 second option', description: 'second description'},
          {name: 'Option 3 third option', value: 'Option 3 third option', description: 'third description'}
      ];

      switch (prop.value) {
          case 'Option 1':
              multiSelectOptions = firstValueOptions;
              break;
          case 'Option 2':
              multiSelectOptions = secondValueOptions;
              break;
          case 'Option 3':
              multiSelectOptions = thirdValueOptions;
              break;
          default:
              // populate some default values in multiSelectOptions here
      }

      api.getProp('multiselect-ref-name').options = multiSelectOptions;
    • Save the form.

     

    There are two things to notice:

    1. The Multi Select List property in the example above will be populated with options only after a value is chosen in the Drop-Down property. For instance, if the form is loaded for a user who doesn't have any value in the attribute of the Drop-Down property then the Multi Select List property will be empty until you select a value from the drop-down. 
    2. It is better to add the same code from the Change Handler of the Drop-Down property to its Initialization Handler as well. This will make sure that when the form initializes with information of a user who already has a value in the attribute of the Drop-Down property, the matching options in the Multi Select List property will be populated immediately (rather then the property will remain empty until you 'touch' the Drop-Down property).

     

    I hope it achieves the required behavior.

     

    Regards,

    David



  • 3.  Re: Changing the multi-select value list based on other attribute in Form creation

    Posted Jan 03, 2019 06:28 AM

    Hello David,

     

    I tried your suggestion and it works good. Thanks much!!

     

     

    Regards,

    V R