<form method="POST" action="{{ route('bonlivraisons.update', $bon_livraison->id) }}">
@csrf
@method('PUT')
<div class="modal-body px-6 py-4 grid gap-5"> <div class="grid grid-cols-2 gap-4">
<div class="col-span-1 items-center justify-between gap-y-1">
<label for="edit_devi_id" class="inline-flex items-center gap-x-3">
<span class="text-sm font-medium leading-6 text-gray-950">
Devis<sup class="text-yellow-600 font-medium">*</sup>
</span>
</label>
<div class="flex shadow-sm overflow-hidden transition duration-75 bg-white">
<div class="min-w-0 flex-1">
<select id="edit_devi_id" name="devi_id"
class="block rounded-lg w-full border-none py-1.5 ps-3 pe-3 text-base ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-inset focus:ring-yellow-600 text-gray-950 transition duration-75">
<option hidden selected disabled>Select Devis </option>
@foreach ($devis as $devi)
<option value="{{ $devi->id }}">{{ $devi->id }}</option>
@endforeach
</select>
</div>
</div>
</div>
</div>
<div class="grid grid-cols-2 gap-4">
<div class="col-span-1 row-span-2 items-center justify-between gap-y-1">
<label class="inline-flex items-center gap-x-3">
<span class="text-sm font-medium leading-6 text-gray-950">Articles<sup
class="text-yellow-600 font-medium">*</sup></span>
</label>
<div
class="overflow-y-scroll max-h-52 flex border p-1 rounded-lg shadow-sm transition duration-75 bg-white">
<div class="min-w-0 flex-1" id="edit_article-details"></div>
</div>
</div>
<div class="col-span-1 row-span-2 items-center justify-between gap-y-1">
<label class="inline-flex items-center gap-x-3">
<span class="text-sm font-medium leading-6 text-gray-950">Services<sup
class="text-yellow-600 font-medium">*</sup></span>
</label>
<div
class="overflow-y-scroll max-h-52 flex border p-1 rounded-lg shadow-sm transition duration-75 bg-white">
<div class="min-w-0 flex-1" id="edit_service-details"></div>
</div>
</div>
<script>
document.getElementById('edit_devi_id').addEventListener('change', function() {
var deviId = this.value;
fetch(`/factureVente/devi/${deviId}`)
.then(response => {
if (!response.ok) {
throw new Error('Network response was not ok');
}
return response.json();
})
.then(data => {
var articleDetailsContainer = document.getElementById('edit_article-details');
var serviceDetailsContainer = document.getElementById('edit_service-details');
articleDetailsContainer.innerHTML = '';
serviceDetailsContainer.innerHTML = '';
data.documentDevis.forEach(documentDevis => {
if (documentDevis.article) {
articleDetailsContainer.innerHTML += `
<li class="flex items-center p-2 rounded hover:bg-gray-100">
<div class="flex items-center justify-between w-full rounded hover:bg-gray-100">
<label for="edit_articles-${documentDevis.article.id}" class="w-full p-2 ml-2 text-sm font-medium text-gray-400 rounded">${documentDevis.article.Nom}</label>
<input type="hidden" name="articles[]" value="${documentDevis.article.id}">
<input type="number" name="quantities[${documentDevis.article.id}]" for="edit_articles-${documentDevis.article.id}" placeholder="Quantity" class="rounded-lg border-none py-1.5 pe-3 text-base ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-inset focus:ring-yellow-600 text-gray-950 transition duration-75 placeholder:text-gray-400 disabled:text-gray-500 sm:text-sm sm:leading-6 bg-white/0 ps-3" min="1">
</div>
</li>
`;
} else if (documentDevis.service) {
serviceDetailsContainer.innerHTML += `
<li class="flex items-center p-2 rounded hover:bg-gray-100">
<div class="flex items-center justify-between w-full rounded hover:bg-gray-100">
<label for="edit_service-${documentDevis.service.id}" class="w-full p-2 ml-2 text-sm font-medium text-gray-400 rounded">${documentDevis.service.Nom}</label>
<input type="hidden" name="services[${documentDevis.service.id}]" value="${documentDevis.service.id}">
</div>
</li>
`;
}
});
})
.catch(error => {
// console.error('Error fetching data:', error);
console.log('Response data:', data);
});
});
</script>
</form>
this is my form edit in this form just item 1 is working in item 2 or 3 or 4 edit she not get articles and services but in items 1 in table is working i dont now whay or where can you help me !!
create and edit and show and delete modals all in index view .
;;;; ;;;
;;;; ;;; ;;;; ;;;
;;;; ;;;
;;;; ;;; ;;;; ;;;
;;;; ;;;
;;;; ;;; ;;;; ;;;
;;;; ;;;
;;;; ;;; ;;;; ;;;
;;;; ;;;
;;;; ;;;
;;;; ;;; ;;;; ;;;; ;;;
;;;; ;;;
;;;
;;;; ;;;
;;;; ;;;
;;;; ;;;
;;;; ;;;