Как получить массив PHP в качестве responseText в ajax, чтобы потом передать его определенному div из ajax

Question

У меня есть форма общей информации. Когда я нажимаю на submit, все значения получаются с помощью javascript и отправляются в функцию PHP с помощью ajax. Функция PHP проверяет форму и возвращает ЛИБО ошибки формы в виде массива ИЛИ успешное сообщение.

Я хочу получить массив, сгенерированный PHP на стороне ajax, и передать его в форму для отображения ошибок в соответствующих полях формы.

Я успешно создал массив ошибок в PHP. print_r ($ arrayname) показывает все значения в виде массива. Но я не хочу показывать, вместо этого я хочу передать его в ajax, получить массив в div и выполнить работу с этим массивом.

--------- AJAX ------

function general()
{
        var xmlHttp = new XMLHttpRequest();
        xmlHttp.open('POST','addGeneral',true);
        var data = new FormData();
        data.append('title',document.getElementById('title').value);
        data.append('firstname',document.getElementById('firstname').value);
        data.append('middlename',document.getElementById('middlename').value);
        data.append('surname',document.getElementById('surname').value);
        xmlHttp.send(data);

        xmlHttp.onreadystatechange = function()
        {
            if(xmlHttp.readyState==4)
            {
              var status = xmlHttp.responseText;
               document.getElementById('responseG').style.display="block";
                     if(status=='true')
                     {
                        document.getElementById('responseG').className="alert alert-success";
                        document.getElementById('responseG').innerHTML="<p>Successfully Updated</p>";
                     }
                  else
                  {
                    document.getElementById('responseG').className="alert alert-danger";
                    document.getElementById('responseG').innerHTML=status;
                  }
            }
        }
}

---- ФУНКЦИЯ PHP ---

public function addGeneral()
{
        $status=array();
        extract($_POST);

        $this->form_validation->set_rules('title','Title','required',array('required' => 'You must provide a %s.'));
        $this->form_validation->set_rules('firstname','First Name','required');
        $this->form_validation->set_rules('middlename','Middle Name','required');
        $this->form_validation->set_rules('surname','Surname','required');

            if($this->form_validation->run()===FALSE)
            {
                $status=$this->form_validation->error_array();
            }else
            {
                $data=array(
                    'title'=>$title,
                    'firstname'=>$firstname,
                    'middlename'=>$middlename,
                    'surname'=>$surname
                );

                $this->Manage_employee_model->update_employee($data);
                $status=array('true');
            }
}

Answer 1

Распечатать сообщение об ошибке в форме

                <?php  
            if(!empty(validation_errors())) {echo 
                validation_errors();}
            ?>

Answer 2

Как только PHP-скрипт завершит работу и браузер получит конец HTML-ответа, все кончено, , вы не можете напрямую изменить вывод, уже отправленный с большим количеством PHP . Что вы можете сделать, это использовать AJAX для получения данных и их рендеринга на стороне клиента с использованием JS, или рендеринга на стороне сервера и просто внедрить результат с помощью JS.

Рендеринг клиента

Для этого вам просто нужен PHP-скрипт для возврата данных, затем зациклите его и добавьте каждый элемент в ваш div в JS. Немного неловко рендерить вещи с нативным JS, но этот подход держит презентацию в одном месте, вместо того, чтобы иметь HTML-код на вашем бэкэнде.

Серверная сторона

$data=array(
    'title'=>$title,
    'firstname'=>$firstname,
    'middlename'=>$middlename,
    'surname'=>$surname
);

echo json_encode($data);

Клиентская сторона

xmlHttp.onreadystatechange = function() {
    if(xmlHttp.readyState==4) {
      var data = JSON.parse(xmlHttp.responseText);
       document.getElementById('responseG').style.display="block";
             if(data.status=='true') {
                document.getElementById('responseG').className="alert alert-success";
                document.getElementById('responseG').innerHTML="<p>Successfully Updated</p>";
             }
          else {
            document.getElementById('responseG').className="alert alert-danger";
            for(var i = 0; i < data.length; i++){ 
                document.getElementById('responseG').innerHTML+= '<p>'+data[i]+'</p>;
            }
        }
    }
}

Сервер рендеринга

Здесь мы используем PHP, чтобы сгенерировать строку HTML на серверной части, отправить ее обратно через AJAX и просто добавить ее в div на стороне клиента. Недостатком здесь является смешивание HTML-шаблонов с вашим внутренним кодом.

Серверная сторона

$data=array(
    'title'=>$title,
    'firstname'=>$firstname,
    'middlename'=>$middlename,
    'surname'=>$surname
);
$html = '';

foreach ($data as $key => $item) {
    $html += '<p>'.$item.'</p>';    
}

echo json_encode(array('html' => $html));

Клиентская сторона

xmlHttp.onreadystatechange = function() {
    if(xmlHttp.readyState==4) {
      var data = JSON.parse(xmlHttp.responseText);
       document.getElementById('responseG').style.display="block";
             if(data.status=='true') {
                document.getElementById('responseG').className="alert alert-success";
                document.getElementById('responseG').innerHTML="<p>Successfully Updated</p>";
             }
          else {
            document.getElementById('responseG').className="alert alert-danger";
            document.getElementById('responseG').innerHTML = data.html;
        }
    }
}

Answer 3

В вашем php-коде после того, как вы выполнили все проверки и заполнили массив ответов, просто выполните echo, чтобы вернуть эти данные в ajax.

Пример в php: echo json_encode($status);

Лучшее место для размещения этого кода - под вашим if заявлением