Group Step Fields using Heading

When we are using a step for combined inputs/models like we have user and profile models and we have assigned the user and profile inputs in a single step and we want the fields the be grouped with a different heading which acts as a divider, see the image below to have an idea.

You can do it by using the option named stepHeadings under the specific step you want the headings it takes an array with the following keys

• text (string) the text to be displayed as the heading.
• before (string) the field before which you want the heading to appear.
• icon (string) the markup for the icon like <i class="fa-user"></i>or the image tag with url you want to display, it defaults to <i class="formwizard-quill-ico"></i>. If you dont wish to use an icon you can pass false.

See the code below for usage

echo FormWizard::widget([
    'steps' => [
        [
            'model' => new Shoots(),
            'title' => 'My Shoots',
            'description' => 'Add your shoots',
            'formInfoText' => 'Fill all fields',
            'stepHeadings' => [
                [
                    'text' => 'Heading with default icon',
                    'before' => 'image'
                ],
                [
                    'text' => 'Heading with no icon',
                    'before' => 'created_at',
                    'icon' => false
                ],
                [
                    'text' => 'Heading with Custom Icon',
                    'before' => 'active',
                    'icon' => '<i class="formwizard-checkmark-ico"></i>'
                ]
            ],
        ],
        [
            'model' => new ContactForm(),
            'title' => 'Contact Information',
            'description' => 'Add your contact details',
            'formInfoText' => 'Fill All fields'
        ]
    ]
]);

You will see the headings like below image