my php variable is reset after open bootstrap modal - php

Question

on my screen, you can see number : 24,26,33 this is the id_user when i click on "Ajouter Mission", the id are set to 24, instead of 26,33. (24 is the id to auth admin), why the id change to the authentified user when i click on modal button ?
dont comment my indian quality front end, i'll do it later :)
and there is my html :
Sorry, i paste everythig because i have no idea where this problem come from.
#extends('layouts.app')
#section('content')
<div class="container">
<div class="row justify-content-center">
<div class="col-md-8">
<div class="card">
<div class="card-header">Dashboard</div>
<div class="card-body">
#if (session('status'))
<div class="alert alert-success" role="alert">
{{ session('status') }}
</div>
#endif
#csrf
You are in home as Admin !
#if(Session::has('succes'))
<div class="alert alert-success">
{{ Session::get('succes')}}
</div>
#endif
</br>
Liste des Utilisateurs
<table class="table table-sstriped card-body">
<thead>
<tr>
<th>Numero Matricule</th>
<th>Nom</th>
<th>Prenom</th>
<th>Rue</th>
<th>Code Postal</th>
<th>Ville</th>
<th>Adresse mail</th>
</tr>
</thead>
<tbody>
#foreach($users as $resp)
<tr>
<td>{{$resp->MATRICULE}}</td>
<td>{{$resp->NOM}}</td>
<td>{{$resp->PRENOM}}</td>
<td>{{$resp->RUE}}</td>
<td>{{$resp->CP}}</td>
<td>{{$resp->VILLE}}</td>
<td>{{$resp->email}}</td>
<td>{{$resp->ID_PERSONNELS}}</td>
<td>
#if($resp->id_role==1)
<form action="{{action('UserController#destroy', $resp['ID_PERSONNELS'])}}" method="post">
#csrf
<input name="_method" type="hidden" value="DELETE">
<button class="btn btn-danger" type="submit">Supprimer</button>
</form>
</td>
#endif
<td>
#if($resp->id_role ==1)
<!-- Button trigger modal -->
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal">
Ajouter Mission{{$resp->ID_PERSONNELS}}
</button>
#else
No Way, it is Admin
#endif
<!-- Modal -->
<div class="modal fade" data-id="$resp->ID_PERSONNELS" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Ajouter une Mission a {{$resp->ID_PERSONNELS}}{{$resp->NOM}}{{$resp->email}}</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<form action="{{route('addmission',26)}}" method="post">
#csrf
<div class="modal-body justify-content-center">
<!----------------------------------Body---------------------------------------------->
<label for="NOM" class="col-md-4 col-form-label text-md-center">{{ __('NOM') }}</label>
<div class="col-md-6">
<input id="NOM" type="text" class="form-control #error('NOM') is-invalid #enderror" name="NOM" required autocomplete="NOM" autofocus> #error('NOM')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span> #enderror
</div>
<label for="DATE_MISSION" class="col-md-4 col-form-label text-md-center">{{ __('DATE_MISSION') }}</label>
<div class="col-md-6">
<input id="DATE_MISSION" type="date" class="form-control #error('DATE_MISSION') is-invalid #enderror" name="DATE_MISSION" required autocomplete="DATE_MISSION" autofocus> #error('DATE_MISSION')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span> #enderror
</div>
<!-- <label class="col-md-4 col-form-label text-md-center" for="ID_PRATICIEN">{{ __('PRATICIEN') }}</label> -->
<!-- <select class="custom-select col-md-4 col-form-label text-md-center" id="inputGroupSelect01">
<option selected>Choose...</option>
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</select> -->
<!--------------------------------End----Body------------------------------------>
<button type="button" class="btn btn-secondary" data-dismiss="modal">Annuler</button>
<button type="submit" class="btn btn-primary">Ajouter Mission</button>
</form>
</div>
</div>
</div>
</td>
</tr>
</tbody> #endforeach
</div>
</table>
</div>
</div>
</div>
</div>
</div>
#endsection #csrf
store controller :
public function store(Request $request, $id){
$miss = User::find($id);
$mission = new Mission;
$mission->NOM =$request->input('NOM');
$mission->ID_PERSONNELS = $miss->ID_PERSONNELS;
$mission->ID_NOTE_DE_FRAIS = 1;
$mission->DATE_MISSION = $request->input('DATE_MISSION');
$mission->save();
return redirect()->action('AdminController#index')->with('succes', 'Mission Ajoutée');
}
and to be sure, the controller for table :
public function index()
{
$id=auth()->id();
$users = User::all();
return view('homeAdmin')->with('users', $users);
}
thx for help :)

Answer 1

You should be using something like AngularJS for this sort of stuff.
However, I believe your issue is that all your generated modals share the same ID, causing the same one to be opened by all the buttons.
Try making the ID of the modal something like MODAL-{{ ID_HERE }} and remember to set the data-target of the button to MODAL-{{ ID_HERE }}
Do this to your button:
data-target=“#MODAL-{{ $resp->id }}”
And to your modal:
id=“MODAL-{{ $resp->id }}”
I don't know what your database structure looks like but use something unique to each row to implement this, e.g. $resp->id
Honestly though, use something like AngularJS, you wouldn’t then have to programmatically generate a modal for all of the entries, you could just fetch the data on page load, ng-repeat them all in however you want and then have a singular modal that refers to the one they clicked, look into it.