Enable Preview Step

When enabled using the "enablePreview"=>true in the main options of the form wizard, after adding all the steps the last step which previews all the inputs entered for the steps. The user can navigate to the step by clicking on the list label inside the preview window. This option is turned off by default, and users will need to specify the enablePreview in the main options.

Customization Options

You can customize the preview steps elements using the following properties

• previewEmptyText (string) : Text used for showing the value for the empty inputs, default is NA.
• classListGroup (string) : Css class for the list group defaults to 'list-group'.
• classListGroupHeading (string) : Css class for the list group heading element, defaults to 'list-group-heading'.
• classListGroupItem (string) : Css class for the list group item, defaults to 'list-group-item-success'.
• classListGroupBadge (string) : Css class for the list group badge that displays the input label, defaults to 'success'.

You just need to use the enablePreview option and assign true under the main options see the code below.

echo FormWizard::widget([
    'enablePreview'=>true,
    'classListGroup' => 'list-group',
    'classListGroupHeading' => 'list-group-heading',
    'classListGroupItem' => 'list-group-item-info',
    'classListGroupBadge' => 'danger',
    'steps' => [
        [
            'model' => new AddressBook(),
            'title' => 'Address book',
            'description' => 'Add Addresses',
            'formInfoText' => 'Fill all fields'
        ],
        [
            'model' => new Shoots(),
            'title' => 'My Shoots',
            'description' => 'Add your shoots',
            'formInfoText' => 'Fill All fields'
        ]
    ]
]);

It looks like below