Open kennethenglisch opened 7 months ago
I would expect it to treat ValidationRule
as a remote rule and so you'll see it fire an AJAX request in the background. You'll have to debug why it's passing on the AJAX request using xdebug.
You can switch to using https://github.com/proengsoft/laravel-jsvalidation/pull/505 as a compromise.
It is treated as a remote rule.
I changed everthing according to #505 but it didn't work for me either.
I also changed the bootstrap5.php for adjusting error placement as well as indicating required fields.
<?php
use Illuminate\Support\Facades\Route;
$excludedRoutes = [
'login',
'password.forgot'
];
?>
<script type="module">
jQuery(document).ready(function () {
$("<?= $validator['selector']; ?>").each(function () {
<?php
if(config('app.params.indicateRequiredFields', false) && !in_array(Route::current()->getName(), $excludedRoutes) ) {
foreach($validator['rules'] as $attribute => $rules) {
// do it always for password confirmation
if($attribute == 'password_confirmation'){
?>
$('label[for="<?= $attribute ?>"]').addClass("required");
<?php
continue;
}
foreach ($rules['laravelValidation'] as $rule) {
if(in_array('required', $rule)) {
?>
$('label[for="<?= $attribute ?>"]').addClass("required");
<?php
}
}
?>
<?php
}
}
?>
$(this).validate({
errorElement: 'div',
errorClass: 'invalid-feedback',
errorPlacement: function (error, element) {
const id = '#' + error.attr('id');
if(element.find(id).length > 0 || element.parent().find(id).length > 0) {
// we already have an error text div, so we skip and don't add a new one
return;
}
if (element.parent('.input-group').length ||
element.prop('type') === 'checkbox' || element.prop('type') === 'radio') {
error.insertAfter(element.parent());
// else just place the validation message immediately after the input
} else if(element[0].classList.contains('select2-hidden-accessible')) {
error.insertAfter(element.parent()[0].lastElementChild);
} else {
error.insertAfter(element);
}
},
highlight: function (element) {
$(element).removeClass('is-valid').addClass('is-invalid'); // add the Bootstrap error class to the control group
},
<?php if (isset($validator['ignore']) && is_string($validator['ignore'])): ?>
ignore: "<?= $validator['ignore']; ?>",
<?php endif; ?>
unhighlight: function (element) {
$(element).removeClass('is-invalid').addClass('is-valid');
},
success: function (element) {
$(element).removeClass('is-invalid').addClass('is-valid'); // remove the Boostrap error class from the control group
},
focusInvalid: true,
<?php if (Config::get('jsvalidation.focus_on_error')): ?>
invalidHandler: function (form, validator) {
if (!validator.numberOfInvalids())
return;
$('html, body').animate({
scrollTop: $(validator.errorList[0].element).offset().top
}, <?= Config::get('jsvalidation.duration_animate') ?>);
},
<?php endif; ?>
rules: <?= json_encode($validator['rules']); ?>
});
});
});
</script>
Maybe I need to debug it and have a look at xdebug.
Subject of the issue
Hello, I'm using your package to validate the client side of the user inputs in my laravel project. Now that I'm using select-inputs with the attribute 'multiple', I got into problems with the Client Side Validation. I need a custom ValidationRule to do my checks if any of the chosen inputs inside of the select are restricted to each other. The Custom ValidationRule works as intended on the server side.
I already tried to use following attributes for the rules:
Your environment
Steps to reproduce
Select Input as HTML:
Profile Request Class:
LicenseTypeRequestRule Class: (I used ValidationRule instead of Rule, because Rule is deprecated)
License Types from the db, exported as php array:
License Types Restrictions from the db, exported as php array:
Expected behaviour
When the user selects the license type 'Obmann' and 'Stellvertretender Obmann' in the multiple-select, the error should be shown, because these types are restricted and can't be selected together. The user should not be able to submit the form.
Actual behaviour
When the user selects the license type 'Obmann' and 'Stellvertretender Obmann' in the multiple-select, the validation passes and the user can submit the form. After the submission the server side validation throws an error.