Bonjour,
Voila je rencontre un petit problème avec mon code.
Code HTML
<form id="p-create" action="{{ route('admin.property.store') }}" method="post" enctype="multipart/form-data">
@csrf
<div class="row">
<div class="col-sm-4">
<div class="form-group">
<label for="title">Titre</label>
<input type="text" id="title" name="title" class="form-control{!! $errors->has('title') ? ' is-invalid' : '' !!}" value="{{ old('title') }}">
<p class="text-danger">{{ $errors->first('title') }}</p>
</div>
</div>
<div class="col-sm-2">
<div class="form-group">
<label for="rooms">Nombre de chambre</label>
<input type="number" id="rooms" name="rooms" class="form-control{!! $errors->has('rooms') ? ' is-invalid' : '' !!}" value="{{ old('rooms') }}">
<p class="text-danger">{{ $errors->first('rooms') }}</p>
</div>
</div>
<div class="col-sm-2">
<div class="form-group">
<label for="bedrooms">Nombre de pieces</label>
<input type="number" id="bedrooms" name="bedrooms" class="form-control{!! $errors->has('bedrooms') ? ' is-invalid' : '' !!}" value="{{ old('bedrooms') }}">
<p class="text-danger">{{ $errors->first('bedrooms') }}</p>
</div>
</div>
<div class="col-sm-2">
<div class="form-group">
<label for="floor">Etage</label>
<input type="number" id="floor" name="floor" class="form-control{!! $errors->has('floor') ? ' is-invalid' : '' !!}" value="{{ old('floor') }}">
<p class="text-danger">{{ $errors->first('floor') }}</p>
</div>
</div>
<div class="col-sm-2">
<div class="form-group">
<label for="surface">Surface</label>
<input type="number" id="surface" name="surface" class="form-control{!! $errors->has('surface') ? ' is-invalid' : '' !!}" value="{{ old('surface') }}">
<p class="text-danger">{{ $errors->first('surface') }}</p>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-2">
<div class="form-group">
<label for="city">Ville</label>
<input type="text" id="city" name="city" class="form-control{!! $errors->has('city') ? ' is-invalid' : '' !!}" value="{{ old('city') }}">
<p class="text-danger">{{ $errors->first('city') }}</p>
</div>
</div>
<div class="col-sm-2">
<div class="form-group">
<label for="address">Address</label>
<input type="text" id="address" name="address" class="form-control{!! $errors->has('address') ? ' is-invalid' : '' !!}" value="{{ old('address') }}">
<p class="text-danger">{{ $errors->first('address') }}</p>
</div>
</div>
<div class="col-sm-3">
<div class="form-group">
<label for="postal_code">Code postal</label>
<input type="number" id="postal_code" name="postal_code" class="form-control{!! $errors->has('postal_code') ? ' is-invalid' : '' !!}" value="{{ old('postal_code') }}">
<p class="text-danger">{{ $errors->first('postal_code') }}</p>
</div>
</div>
<div class="col-sm-3">
<div class="form-group">
<label for="heat">Chauffage</label>
<select class="form-control" name="heat" id="heat">
<option value="Gaz" {!! old('heat') === 'Gaz' ? 'selected' : '' !!}>Gaz</option>
<option value="Electric" {!! old('heat') === 'Electric' ? 'selected' : '' !!}>Electric</option>
</select>
</div>
</div>
<div class="col-sm-2">
<div class="form-group">
<label for="price">Prix</label>
<input type="number" id="price" name="price" class="form-control{!! $errors->has('price') ? ' is-invalid' : '' !!}" value="{{ old('price') }}">
<p class="text-danger">{{ $errors->first('price') }}</p>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-4">
<div class="form-group">
<label for="">Images(une ou 4 images)</label>
<input type="file" name="image[]" class="form-control{!! $errors->has('image') ? ' is-invalid' : '' !!}" multiple>
<p class="text-danger">{{ $errors->first('image') }}</p>
</div>
</div>
<div class="col-sm-4">
<div class="form-group">
<label for="type">Type de biens</label>
<select class="form-control" name="type_id" id="type">
@foreach($types as $type)
<option value="{{ $type->id }}">{{ $type->name }}</option>
@endforeach
</select>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<div class="form-group">
<label for="options">Options</label>
<select class="form-control select2" name="options[]" id="options" multiple>
@foreach($options as $option)
<option value="{{ $option->id }}">{{ $option->name }}</option>
@endforeach
</select>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<div class="form-group">
<label for="description">Description</label>
<textarea name="description" id="description" cols="30" rows="5" class="form-control{!! $errors->has('description') ? ' is-invalid' : '' !!}">{{ old('description') }}</textarea>
<p class="text-danger">{{ $errors->first('description') }}</p>
</div>
</div>
</div>
<button class="btn btn-primary">Enregister</button>
</form>
Code Js
$(document).ready(function () {
var form = $('#p-create');
form.submit(function(e) {
e.preventDefault();
$.ajax({
url : form.attr('action'),
type : form.attr('method'),
data : form.serialize(),
dataType: 'json',
success : function (xhr )
{
},
error: function(xhr)
{
if(xhr.status != 200) {
var errors = xhr.responseJSON.errors;
console.log(errors);
var errorsKey = Object.keys(errors);
for (var i = 0; i < errorsKey.length; i++) {
var key = errorsKey[i];
var error = errors[key].join('');
var input = document.querySelector(`#${key}`);
var p = document.createElement('p');
p.className = 'text-danger';
p.innerHTML = error;
input.classList.add('is-invalid');
input.parentNode.appendChild(p);
}
} else {
}
}
});
});
});
Ce que je veux
J'aimerai que a la soumission du formulaire les erreurs s'affiche en bas des champs
Ce que j'obtiens
Pour certains champs il y as pas de probleme mais pour certains le code ne s'applique. Je ne vois pas ou vais commis d'erreur. Regarder vous aussi pour voir. Merci