在AJAX中提交表单后显示用户的所有错误

Question

I have a form. If something is wrong then error message is shown. Currently it is only showing one error message, even though I am pushing the error messages into an array in PHP and json encoding the array.

What I would basically like to do is this:

$errors = []; // Array creation
if (strlen($username) < 5) { 
    // Add this error to our list
    $errors[] = 'Username not valid.';
} 

if ($password != $passwordRetype) {
    // Add this error to our list
    $errors[] = 'Password does not match our records.';
}

// Repeat this process for other errors
// Then handle your list of errors
foreach ($errors as $error) {
    echo "Error Found: $error<br>";
}   

but only in ajax and php.

Currently I have this (a lot of code so skipping some parts):

 $.ajax({
     url: $form.attr('action'),
     data: formData,
     cache: false,
     contentType: false,
     processData: false,
     type: 'POST',
     success: function(data) {
         console.log(data);
         if (data.status == 'success') {
          console.log("success");
         } else if (data.status == 'not_image') {
          console.log("this is not an image");
         } else if (data.status == 'image_exists') {
          console.log("this image exists");
         }
     });
 });

This is the PHP

$errors_query = array();

            if (!empty($images)) {
                $uploadOk = 0;
                $errors++; 
                $errors_query["status"] = 'image_exists';


            }elseif(!in_array($file_type, $allowed)){
                $uploadOk = 0;
                $errors++; 
                $errors_query["status"] = 'not_image';

            }else{
                $uploadOk = 1;
                $errors_query["status"] = 'success';

            }
    if($errors > 0){
        echo json_encode($errors_query);
        exit();
    }else{
        echo json_encode($errors_query);
        exit();
    }

It works and shows only one response message, even if both data statuses "image_exists" and "not_image" are present. How can I show all the error messages for the user?

Answer 1

It is very simple

Just do like this

PHP Code

       $errors_query = array();


        if (!empty($images)) {

            $errors_query['msg'][] = 'Sorry Image not exists';
            $errors_query['status'] = FALSE;


        } elseif (!in_array($file_type, $allowed)) {

            $errors_query['msg'][] = 'not_image';
            $errors_query['msg'][] = 'msg2';
            $errors_query['msg'][] = 'msg3';
            $errors_query['status'] = FALSE;

        } else {

            $errors_query['msg'][] = 'success';
            $errors_query['status'] = TRUE;

        }


         echo json_encode($errors_query);

jQuery Code

 $.ajax({
             url: 'http://localhost/welcome/raja',
             cache: false,
             contentType: false,
             processData: false,
             type: 'GET',
             success: function(data) {
             var data = JSON.parse(data);
                 if (data.status === true) {

                  console.log("success");

                 } else {

                $.each(data.msg, function( index, value ) {
              console.log( index + ": " + value );
               });


                 }
             },
         });

It is working example i have already tested .Happy Work ............ :)