Shiva
7 months ago

How to get the accordion to open or close depending if there is an error

Posted 7 months ago by Shiva

I've created a page where there is an accordion and in the first accordion there is the personal details and in the second accordion there is business details, the personal accordion will always be open when you land on the page or when you have successfully entered the data. The problem I'm having is that if there is an error in the business accordion then I want the personal accordion to close and the business was to stay open.

My details.blade.php

@extends('layouts.public')
@section('content')
    <div class="content_wrapper">
        <div class="row">
            <div class="col-lg-12">
                <div class="row">
                    <div class="col-lg-12 mt-15">
                        @if($message = Session::get('success'))
                            <div class="alert alert-success" role="alert">
                                {{ $message }}
                            
                                <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                                    <span aria-hidden="true">&times;</span>
                                </button>
                            </div>
                        @endif

                        @if($message = Session::get('error'))
                            <div class="alert alert-danger" role="alert">
                                {{ $message }}

                                <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                                    <span aria-hidden="true">&times;</span>
                                </button>
                            </div>
                        @endif
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-lg-12 mt-60">
                <div class="accordion" id="accordionExample">
                    <div class="card border-dark">
                        <div class="card-header bg-dark" id="headingOne">
                            <h2 class="mb-0">
                                <button class="btn btn-link text-white" type="button" data-toggle="collapse" data-target="#personal-details" aria-expanded="true" aria-controls="collapseOne">
                                    Personal Details
                                </button>
                            </h2>
                        </div>

                        <div id="personal-details" class="collapse show {{ $errors->personal_errors->any() ? 'show' : '' }}" aria-labelledby="headingOne" data-parent="#accordionExample">
                            <div class="card-body">
                                @include('public.users.partials.personal-details')
                            </div>
                        </div>
                    </div>

                    <div class="card border-dark">
                        <div class="card-header bg-dark" id="headingTwo">
                            <h2 class="mb-0">
                                <button class="btn btn-link collapsed text-white" type="button" data-toggle="collapse" data-target="#business-details" aria-expanded="false" aria-controls="business-details">
                                    Business Details
                                </button>
                            </h2>
                        </div>
                        
                        <div id="business-details" class="collapse {{ $errors->business_errors->any() ? 'show' : '' }}" aria-labelledby="headingTwo" data-parent="#accordionExample">
                            <div class="card-body">
                                @include('public.users.partials.business-details')
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@stop

and this is my controller

public function postBusinessDetails(Request $request)
{
    $id = Auth::user()->id;
    $user = User::findOrFail($id);

    $validation = Validator::make($request->all(), $this->getBusinessRules());

    if($validation->fails())
    {
        return redirect()->route('account.details')
                        ->withErrors($validation, 'business_errors')
                        ->with('error', 'There were validation errors');
    }
   

    $user->fill($this->getSafeBusinessInput($request));

    $user->save();

    return redirect()->route('account.details')->with('success', 'Details saved successfully');
}

Please sign in or create an account to participate in this conversation.