Group chained Inputs

Multiple input groups can be chained so that they are shown sequentially, through the use of a button. To use this feature the function s.plt.generate_input_form_groups has to be used. It eases the creation of multiple input forms groups, the user just has to define a dictionary where each key is the name of the group and the value is the list of input components. To activate the sequential show, the parameter dynamic_sequential_show has to be set to True.

The following example:

form_groups = {
    f'form group {i}': [
      {
        'mapping': 'country',
        'fieldName': f'Country {i}',
        'inputType': 'select',
        'options': ['España', 'Colombia']
      },
      {
        'dependsOn': f'Country {i}',
        'mapping': 'city',
        'fieldName': f'City {i}',
        'inputType': 'select',
        'options': {
            'España': ['Madrid', 'Barcelona'],
            'Colombia': ['Bogotá', 'Medellin']
        }
      }
    ] for i in range(4)}

form_groups['Personal information'] = [
    {
        'mapping': 'name',
        'fieldName': 'name',
        'inputType': 'text',
    },
    {
        'mapping': 'surname',
        'fieldName': 'surname',
        'inputType': 'text',
    },
    {
        'mapping': 'age',
        'fieldName': 'age',
        'inputType': 'number',
    },
    {
        'mapping': 'tel',
        'fieldName': 'phone',
        'inputType': 'tel',
    },
    {
        'mapping': 'gender',
        'fieldName': 'Gender',
        'inputType': 'radio',
        'options': ['Male', 'Female', 'No-binary', 'Undefined'],
    },
    {
        'mapping': 'email',
        'fieldName': 'email',
        'inputType': 'email',
    }
]

form_groups['Other data'] = [
    {
        'mapping': 'skills',
        'fieldName': 'Skills',
        'options': ['Backend', 'Frontend', 'UX/UI', 'Api Builder', 'DevOps'],
        'inputType': 'checkbox',
    },
    {
        'mapping': 'birthDay',
        'fieldName': 'Birthday',
        'inputType': 'date',
    },
    {
        'mapping': 'onCompany',
        'fieldName': 'Time on Shimoku',
        'inputType': 'dateRange',
    },
    {
        'mapping': 'hobbies',
        'fieldName': 'Hobbies',
        'inputType': 'select',
        'options': ['Make Strong Api', 'Sailing to Canarias', 'Send Abracitos'],
    },
    {
        'mapping': 'textField2',
        'fieldName': 'Test Text',
        'inputType': 'text',
    },
    {
        'mapping': 'objectives',
        'fieldName': 'Objetivos',
        'inputType': 'multiSelect',
        'options': ['sleep', 'close eyes', 'awake']
    }
]

s.plt.generate_input_form_groups(
    order=0, form_groups=form_groups,
    dynamic_sequential_show=True
)

Initial result

Result after clicking on the 'Next' button for each new group