How to create conditional checkbox ?

Some of the advice you got in your previous thread would likely be beneficial here as well (for example, someone suggested reading up on the SAIL recipes), but I will take a shot at this new use case.

You haven't given much info on what you would want the different checkbox values to be, but I'll assume Pizza Hut gets one set of food options and KFC gets a completely separate set - and the values will dynamically change when one or the other is picked.

I'll create everything using LOAD and WITH variables so this can be copied and pasted into a new interface editor without needing to worry about RI values, etc.

load(

  local!restaurantChoices: {
    {id: 1, name: "KFC"}, 
    {id: 2, name: "Pizza Hut"}
  },
  local!selectedRestaurant,
  local!menuSelection: {},
  
  with(
    
    /* dynamically set the menu choices based on which restaurant is picked */
    local!menuChoices: if(
      isnull(local!selectedRestaurant),
      {},
      if(
        tointeger(local!selectedRestaurant) = 1,
        {
          "Fried Chicken", "Mashed Potatoes", "Cole Slaw", "Biscuits", "Gravy"
        },
        if(
          tointeger(local!selectedRestaurant) = 2,
          {
            "Pizza", "Bread Sticks", "Salad Bar", "Soft Drinks"
          },
          {}
        )
      )
    ),
    
    a!formLayout( 
    /* assuming 17.1 or prior, btw... if using 17.2, change this to a!formLayout_17r1 */
      
      firstColumnContents: {
        a!radioButtonField(
          label: "Chain:",
          labelPosition: "ADJACENT",
          choiceLabels: local!restaurantChoices.name,
          choiceValues: local!restaurantChoices.id,
          value: local!selectedRestaurant,
          saveInto: {
            local!selectedRestaurant,
            
            /* the below will clear the previous menu selection when the restaurant is changed */
            a!save(
              local!menuSelection,
              {}
            )
          }
        ),
        
        if(
          not(isnull(local!selectedRestaurant)),
          a!checkBoxField(
            label: "Make your food choices:",
            labelPosition: "ADJACENT",
            choiceLabels: local!menuChoices,
            choiceValues: local!menuChoices,
            value: local!menuSelection,
            saveInto: local!menuSelection
          ),
          {}
        )
      } 
    )
  )
)

Let me know if this is close to what you're after.

Hi prup1852 I suggest, you better explore SAIL Recipes to know some basics about SAIL before you start working on it. However if you can attach your complete code, then it will be easy to understand your requirement.

Since it sounds like you're in 17.2 and have a!forEach available, I'll switch my example over to a 17.2 layout real quick.

In this updated version i've added one new LOAD variable, which at first is an empty set, but which we will populate with an array of dictionary data, where each dictionary entry will be like {item: "biscuits", size: 1}, where sizes are represented by a number array (1=small, 2=medium, 3=large).  Also note that I've set it up to retain size selections even when menu items are selected and unselected, and even when the restaurant is changed.  This can all be customized to your preference by tweaking the code as needed.

Note: just for fun, I've made each size selection appear in its own dynamic column, now that we're allowed to have an arbitrary number of columns on a form.

load(

  local!restaurantChoices: {
    {id: 1, name: "KFC"}, 
    {id: 2, name: "Pizza Hut"}
  },
  local!selectedRestaurant,
  local!menuSelection: {},
  
  /* set up Menu Selection Sizes to be an array of dictionary -
    the CDT would resemble {item: "item name", size: sizeId} */
  local!menuSelectionSizes: {},
  
  with(
    
    /* dynamically set the menu choices based on which restaurant is picked */
    local!menuChoices: if(
      isnull(local!selectedRestaurant),
      {},
      if(
        tointeger(local!selectedRestaurant) = 1,
        {
          "Fried Chicken", "Mashed Potatoes", "Cole Slaw", "Biscuits", "Gravy"
        },
        if(
          tointeger(local!selectedRestaurant) = 2,
          {
            "Pizza", "Bread Sticks", "Salad Bar", "Soft Drinks"
          },
          {}
        )
      )
    ),
    
    a!formLayout( 
    /* now assuming 17.2 or newer */
      
      contents: {
        a!radioButtonField(
          label: "Chain:",
          labelPosition: "ADJACENT",
          choiceLabels: local!restaurantChoices.name,
          choiceValues: local!restaurantChoices.id,
          value: local!selectedRestaurant,
          saveInto: {
            local!selectedRestaurant,
            
            /* the below will clear the previous menu selection when the restaurant is changed */
            a!save(
              local!menuSelection,
              {}
            )
          }
        ),
        
        if(
          not(isnull(local!selectedRestaurant)),
          a!checkBoxField(
            label: "Make your food choices:",
            labelPosition: "ADJACENT",
            choiceLabels: local!menuChoices,
            choiceValues: local!menuChoices,
            value: local!menuSelection,
            saveInto: {
              a!save(
                local!menuSelection,
                /* this weird saveInto style will attempt to keep the saved value array in the same order as the
                initial checkboxes, since Appian versions 17.1 and later no longer do this automatically */
                index(
                  local!menuChoices,
                  whereContains(
                    save!value,
                    local!menuChoices
                  )
                )
              )
            }
          ),
          {}
        ),
        a!columnsLayout(
          columns: a!forEach(
            local!menuSelection,
            with(
              local!currentIndex: wherecontains(
                fv!item,
                touniformstring(property(local!menuSelectionSizes, "item", {}))
              ),
              a!columnLayout(
                contents: {
                  a!radioButtonField(
                    label: "Select Size: '" & fv!item & "'",
                    labelPosition: "ABOVE",
                    /*instructions: "current index: " & local!currentIndex,*/
                    choiceLabels: {"Small", "Medium", "Large"},
                    choiceValues: {1, 2, 3},
                    value: property(
                      index(
                        local!menuSelectionSizes,
                        local!currentIndex,
                        {}
                      ),
                      "size",
                      null()
                    ),
                    saveInto: {
                      a!save(
                        local!menuSelectionSizes,
                        append(
                          if(
                            isnull(local!currentIndex),
                            local!menuSelectionSizes,
                            remove(local!menuSelectionSizes, local!currentIndex)
                          ),
                          {
                            item: fv!item,
                            size: save!value
                          }
                        ) 
                      )
                    }
                  )
                }
              )
            )
          )
        )
      } 
    )
  )
)

Great that helped me. Earlier i was using a!formLayout_17r1 so used firstColumnContents and secondColumnContents to divide my interface. However i can't use it with a!formLayout. I used Contents instead but i can't divide my interface now. Is there any other keyword to do so in new version ?