I am working on a website with the Laravel framework and need to integrate a multi step from. So far, I am using jquery to validate all inputs and handle the steps and than send it to the server and validate it again.
When doing so, I noticed that the validation on client side (jquery validate) and server side (laravel) is basically the same.
I started to wonder if there is any better solution for this scenario. I know that some approaches handle each step separately (e.g. ../step-1) and store the data in the user session but whis has the downside of bad user experience because the page needs to be reloaded every time.
I was already thinking of sending the data via ajax to the server to validate it every time the step changes, however, I couldn't find a clean way to do so.
if you do not want to reload the page here is what I would do.
East step, use ajax to submit the data and the step number you are at. the back end validates the request data depending on the steps. for example:
switch ($request->step)
{
case 1:
$request->validate([
'Name' => 'required',
'email' => 'required|email
]);
break;
case 2:
$request->validate([
'Phone' => 'required',
'username' => 'required
]);
break;
default:
//default to 1 or something
break;
}
That way if the validation fails, you get the ajax errors on the page, and enable next step only if the previous step returned OK.
I would probably handle it as a SPA and show each of the parts of the form in a modal or similar and when all required fields are filled in and validated client side then I'd submit the form to the server and validate everything in one go and store it.
