PLEASE HELP ME - Livewire Button don't work for me

#1

Hello.

The wire:click attribute doesn’t work at all for me. And nothing appears in my Browser’s DevTool (Network) when I try to debug to read the error message. Help me please cause it wants to drive me crazy.

CODE OF “Resource/views/livewire/administreds.blade.php”:

<div class="row">

  <div class="col-md-4 text-left">

        <div class="form-group has-feedback">

          <button type="button" class="btn btn-success" data-toggle="modal" data-target="#createModal">

            Ajouter

          </button>

        </div>

  </div>

  <div class="col-md-4 text-center">

      <form action="" class="search-form">

          <div class="form-group has-feedback">

              <label for="query" class="sr-only">Search</label>

              <input type="text" wire:model="query" id="query" class="form-control" placeholder="Rechercher par un Nom">

                <span class="glyphicon glyphicon-search form-control-feedback"></span>

          </div>

      </form>

  </div>

  <div class="text-right col-md-4">

      <!-- <select wire:model="perPage" id="per_page" class="custum-select w-auto"> -->

      <select wire:model.lazy="perPage" id="per_page" class="custum-select w-auto">

          @for($i = 5; $i <= 25; $i += 5)

              <option value="{{ $i }}">{{ $i }}</option>

          @endfor

      </select>

      <label for="per_page">par page</label>

  </div>

</div>

<div class="row">

  <div class="col-12">

    @if (session()->has('message'))

      <div class="alert alert-success">

          {{ session('message') }}

      </div>

    @endif

    <table class="table table-bordered">

      <thead>

        <tr>

          <th scope="col">Nom et prénoms</th>

          <th scope="col">Téléphone</th>

          <th scope="col">E-mail</th>

          <th scope="col">Date et Lieu de Naissance</th>

          <th scope="col">Adresse</th>

          <th scope="col">Image</th>

          <th scope="col">Fonction</th>

          <th scope="col">Actions</th>

        </tr>

      </thead>

      <tbody>

          @foreach($administredsList as $administred)

          <tr>

            @if(count($administred->id) > 0)

              <td>{{ $administred->firstname }}  . " " . {{ $administred->lastname }}</td>

              <td>{{ $administred->phone }}</td>

              <td>{{ $administred->email }}</td>

              <td>{{ $administred->birth_date }} . " à " . {{ $administred->birth_place }}</td>

              <td>{{ $administred->residence_commune_id }}</td>

              <td>{{ $administred->picture }}</td>

              <td>{{ $administred->job }}</td>

              <td>

                  <button type="button" class="btn btn-primary"><i class="far fa-eye"></i></button>

                  <button type="button" data-toggle="modal" data-target="#updateModal" wire:click="edit({{ $administred->id }})" class="btn btn-success"><i class="fas fa-edit"></i></button>

                  <button type="button" wire:click="delete({{ $administred->id }})" class="btn btn-danger"><i class="far fa-trash-alt"></i></button>

              </td>

            @else

              Aucun résultat pour le moment

            @endif

          </tr>

        @endforeach

      </tbody>

    </table>

  </div>

  <div class="mt-3 col-md-6 mx-auto">

    {{ $administredsList->links() }}

  </div>

</div>

<!-- Modal -->

<div wire:ignore.self class="modal fade" id="createModal" tabindex="-1" role="dialog" aria-labelledby="createModalLabel" aria-hidden="true">

  <div class="modal-dialog modal-lg" role="document">

      <div class="modal-content">

          <div class="modal-header">

              <h5 class="modal-title" id="createModalLabel">Enregistrer un nouvel administré</h5>

              <button type="button" class="close" data-dismiss="modal" aria-label="Close">

                   <span aria-hidden="true close-btn">×</span>

              </button>

          </div>

         <div class="modal-body">

              <form>

                <div class="col-md-6">

                  <label for="exampleFormControlInput1">Prénoms:</label>

                    <div class="input-group">

                        <span class="input-group-addon">

                            <i class="material-icons">accessible</i>

                        </span>

                        <div class="form-line">

                            <input type="text" wire:model="prenoms" id="exampleFormControlInput1" class="form-control" placeholder="Tous vos prénoms">

                        </div>

                        <div>

                          @error('prenoms') <span class="text-danger">{{ $message }}</span> @enderror

                        </div>

                    </div>

                </div>

                <div class="col-md-6">

                  <label for="exampleFormControlInput2">Nom:</label>

                    <div class="input-group">

                        <span class="input-group-addon">

                            <i class="material-icons">assignment_ind</i>

                        </span>

                        <div class="form-line">

                            <input type="text" wire:model="nom" id="exampleFormControlInput2" class="form-control" placeholder="Nom de famille">

                        </div>

                        <div>

                          @error('nom') <span class="text-danger">{{ $message }}</span> @enderror

                        </div>

                    </div>

                </div>

                <div class="col-md-6">

                  <label for="exampleFormControlInput3">Numéro de Téléphone officiel:</label>

                    <div class="input-group">

                        <span class="input-group-addon">

                            <i class="material-icons">phone_iphone</i>

                        </span>

                        <div class="form-line">

                            <input type="text" class="form-control" wire:model="numero" id="exampleFormControlInput3" placeholder="Numéro de téléphone">

                        </div>

                        <div>

                          @error('numero') <span class="text-danger">{{ $message }}</span> @enderror

                        </div>

                    </div>

                </div>

                <div class="col-md-6">

                  <label for="exampleFormControlInput4">Autre Numéro de Téléphone:</label>

                    <div class="input-group">

                        <span class="input-group-addon">

                            <i class="material-icons">phone</i>

                        </span>

                        <div class="form-line">

                            <input type="text" class="form-control" wire:model="numero2" id="exampleFormControlInput4" placeholder="Autre numéro de téléphone">

                        </div>

                        <div>

                          @error('numero2') <span class="text-danger">{{ $message }}</span> @enderror

                        </div>

                    </div>

                </div>

                <div class="col-md-6">

                  <label for="exampleFormControlInput5">Adresse E-mail:</label>

                    <div class="input-group">

                        <span class="input-group-addon">

                            <i class="material-icons">email</i>

                        </span>

                        <div class="form-line">

                            <input type="email" class="form-control email" wire:model="email" id="exampleFormControlInput5" placeholder="E-mail">

                        </div>

                        <div>

                          @error('email') <span class="text-danger">{{ $message }}</span> @enderror

                        </div>

                    </div>

                </div>

                <div class="col-md-6">

                  <label for="exampleFormControlInput6">Date de Naissance:</label>

                    <div class="input-group">

                        <span class="input-group-addon">

                            <i class="material-icons"></i>

                        </span>

                        <div class="form-line">

                            <input type="date" class="form-control" wire:model="date" id="exampleFormControlInput6" placeholder="Entrer la date ici">

                        </div>

                        <div>

                          @error('date') <span class="text-danger">{{ $message }}</span> @enderror

                        </div>

                    </div>

                </div>

                <div class="col-md-6">

                  <label for="exampleFormControlInput7">Lieu de Naissance:</label>

                    <div class="input-group">

                        <span class="input-group-addon">

                            <i class="material-icons">map</i>

                        </span>

                        <div class="form-line">

                            <input type="text" class="form-control" wire:model="lieu" id="exampleFormControlInput7" placeholder="Entrer le lieu">

                        </div>

                        <div>

                          @error('lieu') <span class="text-danger">{{ $message }}</span> @enderror

                        </div>

                    </div>

                </div>

                <div class="col-md-6">

                  <label for="exampleFormControlInput8">Commune de Naissance:</label>

                    <div class="input-group">

                        <span class="input-group-addon">

                            <i class="material-icons">map</i>

                        </span>

                        <div class="form-line">

                            <input type="text" class="form-control" wire:model="commune" id="exampleFormControlInput8" placeholder="Commune">

                        </div>

                        <div>

                          @error('commune') <span class="text-danger">{{ $message }}</span> @enderror

                        </div>

                    </div>

                </div>

                <div class="col-md-6">

                  <label for="exampleFormControlInput9">Adresse:</label>

                    <div class="input-group">

                        <span class="input-group-addon">

                            <i class="material-icons">map</i>

                        </span>

                        <div class="form-line">

                            <input type="text" class="form-control" wire:model="adresse" id="exampleFormControlInput9" placeholder="Résidence, quartier, ...">

                        </div>

                        <div>

                          @error('adresse') <span class="text-danger">{{ $message }}</span> @enderror

                        </div>

                    </div>

                </div>

                <div class="col-md-6">

                  <label for="exampleFormControlInput10">Fonction:</label>

                    <div class="input-group">

                        <span class="input-group-addon">

                            <i class="material-icons">work</i>

                        </span>

                        <div class="form-line">

                            <input type="text" class="form-control" wire:model="fonction" id="exampleFormControlInput10" placeholder="Votre fonction">

                        </div>

                        <div>

                          @error('fonction') <span class="text-danger">{{ $message }}</span> @enderror

                        </div>

                    </div>

                </div>

                <div class="col-md-6">

                  <label for="exampleFormControlInput11">Pièce d'Identité:</label>

                    <div class="input-group">

                        <span class="input-group-addon">

                            <i class="material-icons">face</i>

                        </span>

                        <div class="form-line">

                            <input type="text" class="form-control" wire:model="identite" id="exampleFormControlInput11" placeholder="Type de pièce">

                        </div>

                        <div>

                          @error('identite') <span class="text-danger">{{ $message }}</span> @enderror

                        </div>

                    </div>

                </div>

                <div class="col-md-6">

                  <label for="exampleFormControlInput12">Numéro de la Pièce d'identité:</label>

                    <div class="input-group">

                        <span class="input-group-addon">

                            <i class="material-icons">perm_identity</i>

                        </span>

                        <div class="form-line">

                            <input type="text" class="form-control" wire:model="piece" id="exampleFormControlInput12" placeholder="Numero de la pièce">

                        </div>

                        <div>

                          @error('piece') <span class="text-danger">{{ $message }}</span> @enderror

                        </div>

                    </div>

                </div>

                <div class="col-md-6">

                  <label for="exampleFormControlInput13">Numéro de l'extrait de Naissance:</label>

                    <div class="input-group">

                        <span class="input-group-addon">

                            <i class="material-icons">book</i>

                        </span>

                        <div class="form-line">

                            <input type="text" class="form-control" wire:model="extrait" id="exampleFormControlInput13" placeholder="">

                        </div>

                        <div>

                          @error('extrait') <span class="text-danger">{{ $message }}</span> @enderror

                        </div>

                    </div>

                </div>

                <div class="col-md-6">

                  <label for="exampleFormControlInput14">Sexe:</label>

                    <div class="input-group">

                        <span class="input-group-addon">

                            <i class="material-icons">accessibility</i>

                        </span>

                        <div class="form-line">

                          <select class="form-control" id="exampleFormControlInput14" wire:model="sexe" >

                            <option>Masculin</option>

                            <option>Féminin</option>

                          </select>

                        </div>

                        <div>

                          @error('sexe') <span class="text-danger">{{ $message }}</span> @enderror

                        </div>

                    </div>

                </div>

                <div class="col-md-12">

                  <label for="exampleFormControlInput15">Image:</label>

                    <div class="input-group">

                        <span class="input-group-addon">

                            <i class="material-icons"></i>

                        </span>

                        <div class="form-line">

                            <input type="file" class="form-control" wire:model="image" id="exampleFormControlInput15" placeholder="">

                        </div>

                        <div>

                          @error('image') <span class="text-danger">{{ $message }}</span> @enderror

                        </div>

                    </div>

                </div>

              </form>

          </div>

          <div class="modal-footer">

              <button type="button" class="btn btn-secondary close-btn" data-dismiss="modal">Close</button>

              <button type="button" wire:click.prevent="store()" class="btn btn-primary close-modal">Valider</button>

          </div>

      </div>

  </div>

</div>

PLEASE HELP ME. I REALLY NEED YOUR HELP

#2

CODE OF FILE THAT INCLUDE THE LIVEWIRE TEMPLATE:

<!DOCTYPE html>

<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=Edge">

    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">

    <meta name="csrf-token" content="{{ csrf_token() }}">

    <title></title>

    <!-- Favicon-->

    <link rel="icon" href="{{asset('favicon.ico')}}" type="image/x-icon">

    <!-- Google Fonts -->

    <link href="https://fonts.googleapis.com/css?family=Roboto:400,700&subset=latin,cyrillic-ext" rel="stylesheet" type="text/css">

    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet" type="text/css">

    <!-- FontAwesome Icons Css -->

    <link href="{{asset('fontawesome/css/all.css')}}" rel="stylesheet" />

    <link href="{{asset('bootstrap-3.3.7/css/bootstrap.css')}}" rel="stylesheet">

    <!-- Waves Effect Css -->

    <link href="{{asset('plugins/node-waves/waves.css')}}" rel="stylesheet" />

    <!-- Animation Css -->

    <link href="{{asset('plugins/animate-css/animate.css')}}" rel="stylesheet" />

    <!-- Custom Css -->

    <link href="{{asset('css/style.css')}}" rel="stylesheet">

    <!-- AdminBSB Themes. You can choose a theme from css/themes instead of get all themes -->

    <link href="{{asset('css/themes/all-themes.css')}}" rel="stylesheet" />

    <!-- Animation Css -->

    <link href="{{asset('plugins/animate-css/animate.css')}}" rel="stylesheet" />

    

<!-- Dropzone Css -->

    <link href="{{asset('plugins/dropzone/dropzone.css')}}" rel="stylesheet">

    <!-- Multi Select Css -->

    <link href="{{asset('plugins/multi-select/css/multi-select.css')}}" rel="stylesheet">

    <!-- Bootstrap Spinner Css -->

    <link href="{{asset('plugins/jquery-spinner/css/bootstrap-spinner.css')}}" rel="stylesheet">

    <!-- Bootstrap Tagsinput Css -->

    <link href="{{asset('plugins/bootstrap-tagsinput/bootstrap-tagsinput.css')}}" rel="stylesheet">

    <!-- Bootstrap Select Css -->

    <link href="{{asset('plugins/bootstrap-select/css/bootstrap-select.css')}}" rel="stylesheet" />

    <!-- noUISlider Css -->

    <link href="{{asset('plugins/nouislider/nouislider.min.css')}}" rel="stylesheet" />

    @livewireStyles

</head>

<body class="theme-green">

<!-- Page Loader -->

<div class="page-loader-wrapper">

    <div class="loader" >

        <div class="preloader">

            <div class="spinner-layer pl-white">

                <div class="circle-clipper left">

                    <div class="circle"></div>

                </div>

                <div class="circle-clipper right">

                    <div class="circle"></div>

                </div>

            </div>

        </div>

        <p>Veuillez patienter...</p>

    </div>

</div>

<!-- #END# Page Loader -->

<!-- Overlay For Sidebars -->

<div class="overlay"></div>

<!-- #END# Overlay For Sidebars -->

<!-- Search Bar -->

<div class="search-bar">

    <div class="search-icon">

        <i class="material-icons">search</i>

    </div>

    <input type="text" placeholder="START TYPING...">

    <div class="close-search">

        <i class="material-icons">close</i>

    </div>

</div>

<!-- #END# Search Bar -->

<!-- Top Bar -->

<nav class="navbar">

    <div class="container-fluid">

        <div class="navbar-header">

            <a href="javascript:void(0);" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false"></a>

            <a href="javascript:void(0);" class="bars"></a>

            <a class="navbar-brand" href="{{route('console.home')}}">E-COMMUNE - ADVANTECH</a>

        </div>

        <div class="collapse navbar-collapse" id="navbar-collapse">

            <ul class="nav navbar-nav navbar-right">

                <!-- Call Search -->

                <li><a href="javascript:void(0);" class="js-search" data-close="true"><i class="material-icons">search</i></a></li>

                <!-- #END# Call Search -->

                <!-- Notifications -->

                <li class="dropdown">

                    <a href="javascript:void(0);" class="dropdown-toggle" data-toggle="dropdown" role="button">

                        <i class="material-icons">notifications</i>

                        <span class="label-count">7</span>

                    </a>

                    <ul class="dropdown-menu">

                        <li class="header">NOTIFICATIONS</li>

                        <li class="body">

                            <ul class="menu">

                                <li>

                                    <a href="javascript:void(0);">

                                        <div class="icon-circle bg-light-green">

                                            <i class="material-icons">person_add</i>

                                        </div>

                                        <div class="menu-info">

                                            <h4>12 new members joined</h4>

                                            <p>

                                                <i class="material-icons">access_time</i> 14 mins ago

                                            </p>

                                        </div>

                                    </a>

                                </li>

                                <li>

                                    <a href="javascript:void(0);">

                                        <div class="icon-circle bg-cyan">

                                            <i class="material-icons">add_shopping_cart</i>

                                        </div>

                                        <div class="menu-info">

                                            <h4>4 sales made</h4>

                                            <p>

                                                <i class="material-icons">access_time</i> 22 mins ago

                                            </p>

                                        </div>

                                    </a>

                                </li>

                                <li>

                                    <a href="javascript:void(0);">

                                        <div class="icon-circle bg-red">

                                            <i class="material-icons">delete_forever</i>

                                        </div>

                                        <div class="menu-info">

                                            <h4><b>Nancy Doe</b> deleted account</h4>

                                            <p>

                                                <i class="material-icons">access_time</i> 3 hours ago

                                            </p>

                                        </div>

                                    </a>

                                </li>

                                <li>

                                    <a href="javascript:void(0);">

                                        <div class="icon-circle bg-orange">

                                            <i class="material-icons">mode_edit</i>

                                        </div>

                                        <div class="menu-info">

                                            <h4><b>Nancy</b> changed name</h4>

                                            <p>

                                                <i class="material-icons">access_time</i> 2 hours ago

                                            </p>

                                        </div>

                                    </a>

                                </li>

                                <li>

                                    <a href="javascript:void(0);">

                                        <div class="icon-circle bg-blue-grey">

                                            <i class="material-icons">comment</i>

                                        </div>

                                        <div class="menu-info">

                                            <h4><b>John</b> commented your post</h4>

                                            <p>

                                                <i class="material-icons">access_time</i> 4 hours ago

                                            </p>

                                        </div>

                                    </a>

                                </li>

                                <li>

                                    <a href="javascript:void(0);">

                                        <div class="icon-circle bg-light-green">

                                            <i class="material-icons">cached</i>

                                        </div>

                                        <div class="menu-info">

                                            <h4><b>John</b> updated status</h4>

                                            <p>

                                                <i class="material-icons">access_time</i> 3 hours ago

                                            </p>

                                        </div>

                                    </a>

                                </li>

                                <li>

                                    <a href="javascript:void(0);">

                                        <div class="icon-circle bg-purple">

                                            <i class="material-icons">settings</i>

                                        </div>

                                        <div class="menu-info">

                                            <h4>Settings updated</h4>

                                            <p>

                                                <i class="material-icons">access_time</i> Yesterday

                                            </p>

                                        </div>

                                    </a>

                                </li>

                            </ul>

                        </li>

                        <li class="footer">

                            <a href="javascript:void(0);">View All Notifications</a>

                        </li>

                    </ul>

                </li>

                <!-- #END# Notifications -->

                <!-- Tasks -->

                <li class="dropdown">

                    <a href="javascript:void(0);" class="dropdown-toggle" data-toggle="dropdown" role="button">

                        <i class="material-icons">flag</i>

                        <span class="label-count">9</span>

                    </a>

                    <ul class="dropdown-menu">

                        <li class="header">TASKS</li>

                        <li class="body">

                            <ul class="menu tasks">

                                <li>

                                    <a href="javascript:void(0);">

                                        <h4>

                                            Footer display issue

                                            <small>32%</small>

                                        </h4>

                                        <div class="progress">

                                            <div class="progress-bar bg-pink" role="progressbar" aria-valuenow="85" aria-valuemin="0" aria-valuemax="100" style="width: 32%">

                                            </div>

                                        </div>

                                    </a>

                                </li>

                                <li>

                                    <a href="javascript:void(0);">

                                        <h4>

                                            Make new buttons

                                            <small>45%</small>

                                        </h4>

                                        <div class="progress">

                                            <div class="progress-bar bg-cyan" role="progressbar" aria-valuenow="85" aria-valuemin="0" aria-valuemax="100" style="width: 45%">

                                            </div>

                                        </div>

                                    </a>

                                </li>

                                <li>

                                    <a href="javascript:void(0);">

                                        <h4>

                                            Create new dashboard

                                            <small>54%</small>

                                        </h4>

                                        <div class="progress">

                                            <div class="progress-bar bg-teal" role="progressbar" aria-valuenow="85" aria-valuemin="0" aria-valuemax="100" style="width: 54%">

                                            </div>

                                        </div>

                                    </a>

                                </li>

                                <li>

                                    <a href="javascript:void(0);">

                                        <h4>

                                            Solve transition issue

                                            <small>65%</small>

                                        </h4>

                                        <div class="progress">

                                            <div class="progress-bar bg-orange" role="progressbar" aria-valuenow="85" aria-valuemin="0" aria-valuemax="100" style="width: 65%">

                                            </div>

                                        </div>

                                    </a>

                                </li>

                                <li>

                                    <a href="javascript:void(0);">

                                        <h4>

                                            Answer GitHub questions

                                            <small>92%</small>

                                        </h4>

                                        <div class="progress">

                                            <div class="progress-bar bg-purple" role="progressbar" aria-valuenow="85" aria-valuemin="0" aria-valuemax="100" style="width: 92%">

                                            </div>

                                        </div>

                                    </a>

                                </li>

                            </ul>

                        </li>

                        <li class="footer">

                            <a href="javascript:void(0);">View All Tasks</a>

                        </li>

                    </ul>

                </li>

                <!-- #END# Tasks -->

            </ul>

        </div>

    </div>

</nav>

<!-- #Top Bar -->

<section>

    <!-- Left Sidebar -->

    <aside id="leftsidebar" class="sidebar">

        <!-- User Info -->

        <div class="user-info">

            <div class="image">

                <img src="{{asset('images/user.png')}}" width="48" height="48" alt="User" />

            </div>

            <div class="info-container">

                <div class="name" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">John Doe</div>

                <div class="email">[email protected]</div>

                <div class="btn-group user-helper-dropdown">

                    <i class="material-icons" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">keyboard_arrow_down</i>

                    <ul class="dropdown-menu pull-right">

                        <li><a href="javascript:void(0);"><i class="material-icons">person</i>Profile</a></li>

                        <li role="seperator" class="divider"></li>

                        <li><a href="javascript:void(0);"><i class="material-icons">group</i>Followers</a></li>

                        <li><a href="javascript:void(0);"><i class="material-icons">shopping_cart</i>Sales</a></li>

                        <li><a href="javascript:void(0);"><i class="material-icons">favorite</i>Likes</a></li>

                        <li role="seperator" class="divider"></li>

                        <li><a href="javascript:void(0);" href="{{ route('logout') }}"

                               onclick="event.preventDefault();

                                document.getElementById('logout-form').submit();">>

                                <i class="material-icons">input</i>Sign Out</a>

                            <form id="logout-form" action="{{ route('logout') }}" method="POST" class="d-none">

                                @csrf

                            </form>

                        </li>

                    </ul>

                </div>

            </div>

        </div>

        <!-- #User Info -->

        <!-- Menu -->

        <div class="menu">

            <ul class="list">

                <li class="header">MAIN NAVIGATION</li>

                <li class="active">

                    <a href="index.html')}}">

                        <i class="material-icons">home</i>

                        <span>Accueil</span>

                    </a>

                </li>

                <li>

                    <a href="{{asset('pages/typography.html')}}">

                        <i class="material-icons">business</i>

                        <span>Commerces</span>

                    </a>

                </li>

                <li>

                    <a href="">

                        <i class="material-icons">people_alt</i>

                        <span>Administrés</span>

                    </a>

                </li>

                <li>

                    <a href="{{route('console.agent')}}">

                        <i class="material-icons">people_outline</i>

                        <span>Agents</span>

                    </a>

                </li>

                <li>

                    <a href="{{route('console.mairie')}}">

                        <i class="material-icons">business_center</i>

                        <span>Mairies</span>

                    </a>

                </li>

                <li>

                    <a href="javascript:void(0);" class="menu-toggle">

                        <i class="material-icons">settings</i>

                        <span>Paramètre</span>

                    </a>

                    <ul class="ml-menu">

                        <li>

                            <a href="{{route('console.commune')}}">

                                <span>Commune</span>

                            </a>

                        </li>

                        <li>

                            <a href="javascript:void(0);">

                                <span>Type de commerce</span>

                            </a>

                        </li>

                        <li>

                            <a href="javascript:void(0);">

                                <span>Méthode de paiement</span>

                            </a>

                        </li>

                        <li>

                            <a href="{{route('console.role')}}">

                                <span>Rôle</span>

                            </a>

                        </li>

                        <li>

                            <a href="{{route('console.permission')}}">

                                <span>Permissions</span>

                            </a>

                        </li>

                    </ul>

                </li>

                <li>

                    <a href="javascript:void(0);" class="menu-toggle">

                        <i class="material-icons">view_list</i>

                        <span>Rapports</span>

                    </a>

                    <ul class="ml-menu">

                        <li>

                            <a href="{{asset('pages/ui/alerts.html')}}">Alerts</a>

                        </li>

                        <li>

                            <a href="{{asset('pages/ui/animations.html')}}">Animations</a>

                        </li>

                        <li>

                            <a href="{{asset('pages/ui/badges.html')}}">Badges</a>

                        </li>

                    </ul>

                </li>

            </ul>

        </div>

        <!-- #Menu -->

        <!-- Footer -->

        <div class="legal">

            <div class="copyright">

                Copyright &copy; <script>document.write(new Date().getFullYear());</script> | <a href="https://advantech-sa.com/">Advantech SA - All rights reserved</a>.

            </div>

        </div>

        <!-- #Footer -->

    </aside>

    <!-- #END# Left Sidebar -->

    <!-- Right Sidebar -->

    <aside id="rightsidebar" class="right-sidebar">

    </aside>

    <!-- #END# Right Sidebar -->

</section>

<section class="content">

    <div class="container-fluid">

        <div class="block-header">

            <h2>GESTION DES ADMINISTRES</h2>

        </div>

        <!-- Body Copy -->

        <div class="row clearfix">

            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">

                <div class="card">

                    <div class="body">

                        @livewire('administreds')

                    </div>

                </div>

            </div>

        </div>

        <!-- #END# Body Copy -->

    </div>

</section>

<!-- Jquery Core Js -->

<script src="{{asset('plugins/jquery/jquery.min.js')}}"></script>

<!-- Bootstrap Core Js -->

<script src="{{asset('bootstrap-3.3.7/js/bootstrap.min.js')}}"></script>

<!-- Select Plugin Js -->

<script src="{{asset('plugins/bootstrap-select/js/bootstrap-select.js')}}"></script>

<!-- Slimscroll Plugin Js -->

<script src="{{asset('plugins/jquery-slimscroll/jquery.slimscroll.js')}}"></script>

<!-- Waves Effect Plugin Js -->

<script src="{{asset('plugins/node-waves/waves.js')}}"></script>

<!-- Custom Js -->

<script src="{{asset('js/admin.js')}}"></script>

<!-- Demo Js -->

<script src="{{asset('js/demo.js')}}"></script>

<!-- Bootstrap Colorpicker Js -->

<script src="{{asset('plugins/bootstrap-colorpicker/js/bootstrap-colorpicker.js')}}"></script>

<!-- Dropzone Plugin Js -->

<script src="{{asset('plugins/dropzone/dropzone.js')}}"></script>

<!-- Input Mask Plugin Js -->

<script src="{{asset('plugins/jquery-inputmask/jquery.inputmask.bundle.js')}}"></script>

<!-- Multi Select Plugin Js -->

<script src="{{asset('plugins/multi-select/js/jquery.multi-select.js')}}"></script>

<!-- Jquery Spinner Plugin Js -->

<script src="{{asset('plugins/jquery-spinner/js/jquery.spinner.js')}}"></script>

<!-- Bootstrap Tags Input Plugin Js -->

<script src="{{asset('plugins/bootstrap-tagsinput/bootstrap-tagsinput.js')}}"></script>

<!-- Demo Js -->

<script src="{{asset('js/demo.js')}}"></script>

@include('flashy::message')

@livewireScripts

<script type="text/javascript">

    window.livewire.on('userStore', () => {

        $('#createModal').modal('hide');

    });

</script>

</body>

</html>
#3

try to remove the class <div class="row"> in the top of your blade page.

#4

which form you are talking about? you have 2 forms inside your blade and none of them has an action.

in general, you must do this

in your blade

<form wire:submit.prevent="yourAction">
     
    <input type="text" wire:model="name"/>
    <button type="submit">Save</button>
</form>

in your component

// ....
   public function yourAction()
   {
      // your logic here
   }

// ....

see more here

#5

At the Livewire component level, there is the “store” method.
AND It’s the same. Nothing has changed. It still does not work. The problem persists despite the following changes to the affected “form” tag:

<div class="modal-body">

              <form wire:submit.prevent="store">

                <div class="col-md-6">

                  <label for="exampleFormControlInput1">Prénoms:</label>

                    <div class="input-group">

                        <span class="input-group-addon">

                            <i class="material-icons">accessible</i>

                        </span>

                        <div class="form-line">

                            <input type="text" wire:model="prenoms" id="exampleFormControlInput1" class="form-control" placeholder="Tous vos prénoms">

                        </div>

                        <div>

                          @error('prenoms') <span class="text-danger">{{ $message }}</span> @enderror

                        </div>

                    </div>

                </div>
....
...
...
<button type="submit">SAVE</button>

PLEASE HELP ME !!!

#6

I think you are missing the @csrf tag after your form tag.

<form wire:submit.prevent="store">
@csrf
<div class="col-md-6">
#7

There is no @csrf in livewire