UiPath Forms Tutorial - Check / Uncheck All Select Boxes

Hi,

Recently, I came across a customer requirement where we need to check / uncheck all select boxes in an UiPath form. I am able to come up with a working solution after doing some R&D. I wanted to share the solution for the benefit of others.

Below are the steps to build Check/Uncheck All option for select boxes in an UiPath form.

  1. Create a form and add a Select box and Button component

  2. Add few values to the select boxes and rename the button component like below
    formDesign

  3. Edit the ‘Check / Uncheck All’ button and change the Action to Event and provide an event name.
    buttonSettings
    Note: Event name and the field key should not be the same.

  4. Under logic, create a new logic and event trigger as shown below

  5. Add new Action of type ‘Custom Action’
    Enter the below Javascript and Save the logic.

instance.emit('updateData', {});

if(Object.values(data.selectBoxes)[0]){//Check if the first select box is checked
  //Uncheck all if already selected
 Object.keys(data.selectBoxes).forEach((prop) => data.selectBoxes[prop] = false);
       }else{
  //select all if unselected
  Object.keys(data.selectBoxes).forEach((prop) => data.selectBoxes[prop] = true);
}
  1. Save and test the workflow.

Sample project can be found here
Sample Project.zip (14.1 KB)

Happy automation :slightly_smiling_face:

Thanks,
Praga

3 Likes

Pretty useful @Praga_Vivek :innocent::+1:

I came across many forum queries with this case.

Thanks
#nK