Giter Site home page Giter Site logo

laravel-wizard's Introduction

Laravel-wizard

simple laravel step-by-step wizard

Required

php ^7.0
laravel ^5.5

Install

$ composer require smajti1/laravel-wizard

Example/How

  1. add routes

    Route::get('wizard/user/{step?}', 'UserWizardController@wizard')->name('wizard.user');
    Route::post('wizard/user/{step}', 'UserWizardController@wizardPost')->name('wizard.user.post');
  2. create steps

    add autoload field in composer.json file:

     ...
     "autoload": {
        "psr-4": {
             ...
             "App\\Wizard\\Steps\\": "app/Steps"
         },
     ...
    

    regenerate autoloader

     $ composer dump-autoload
    

    create step app/Steps/SetUserNameStep.php

    namespace App\Wizard\Steps;
    
    class SetUserNameStep extends \Smajti1\Laravel\Step
    {
    
        public static $label = 'Set user name';
        public static $slug = 'set-user-name';
        public static $view = 'wizard.user.steps._set_user_name';
    
        public function process(\Illuminate\Http\Request $request)
        {
            // for example, create user
            ...
            // next if you want save one step progress to session use
            $this->saveProgress($request);
        }
    
        public function rules(\Illuminate\Http\Request $request = null): array
        {
            return [
                'username' => 'required|min:4|max:255',
            ];
        }
    }
  3. create controller

    public $steps = [
        'set-username-key' => SetUserNameStep::class,
        SetPhoneStep::class,
        ...
    ];
    
    protected $wizard;
    
    public function __construct()
    {
        $this->wizard = new Wizard($this->steps, $sessionKeyName = 'user');
    }
    
    public function wizard($step = null)
    {
        try {
            if (is_null($step)) {
                $step = $this->wizard->firstOrLastProcessed();
            } else {
                $step = $this->wizard->getBySlug($step);
            }
        } catch (StepNotFoundException $e) {
            abort(404);
        }
    
        return view('wizard.user.base', compact('step'));
    }
    
    public function wizardPost(Request $request, $step = null)
    {
        try {
            $step = $this->wizard->getBySlug($step);
        } catch (StepNotFoundException $e) {
            abort(404);
        }
    
        $this->validate($request, $step->rules($request));
        $step->process($request);
    
        return redirect()->route('wizard.user', [$this->wizard->nextSlug()]);
    }
  4. add base view $wizard variable is now automatic sheared with view

    <ol>
        @foreach($wizard->all() as $key => $_step)
            <li>
                @if($step->index == $_step->index)
                    <strong>{{ $_step::$label }}</strong>
                @elseif($step->index > $_step->index)
                    <a href="{{ route('wizard.user', [$_step::$slug]) }}">{{ $_step::$label }}</a>
                @else
                    {{ $_step::$label }}
                @endif
            </li>
        @endforeach
    </ol>
    <form action="{{ route('wizard.user.post', [$step::$slug]) }}" method="POST">
        {{ csrf_field() }}
     
        @include($step::$view, compact('step', 'errors'))
    
        @if ($wizard->hasPrev())
            <a href="{{ route('wizard.user', ['step' => $wizard->prevSlug()]) }}">Back</a>
        @else
            <a href="#">Back</a>
        @endif
    
        <span>Step {{ $step->number }}/{{ $wizard->limit() }}</span>
    
        @if ($wizard->hasNext())
            <button type="submit">Next</button>
        @else
            <button type="submit">Done</button>
        @endif
    </form>

License

Laravel wizard is open-sourced software licensed under the MIT license

laravel-wizard's People

Contributors

smajti1 avatar

Watchers

Ashok Gelal avatar James Cloos avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.