Проверка формы Codeigniter в ajax

Question

Как я могу вернуться на страницу просмотра и выполнить модальную проверку с ошибками проверки, если проверка запускается неверно ..

Я хочу показать ошибки проверки в модальной форме.

Я новыйв jquery ajax ..

Нужно ли добавить в мой jquery .. или каким образом я могу это сделать ..

Контроллер

public function update(){

    $this->form_validation->set_rules('lname', 'Family Name', 'required');

    if ($this->form_validation->run() == FALSE) {

    }
    else {

        $this->home_model->update();
        redirect(base_url());
    }
}

Jquery

$(document).on('click', '#update', function() {
        console.log($(this).attr('data-registerid'));
        $.ajax({
            url: "<?php echo base_url('home/get_data')?>",
            type: "POST",
            dataType: "JSON",
            data: {
                "id": $(this).attr('data-registerid')
            },
            success: function(data) {
                console.log(data);
                $('#no').val(data.rec['no']);
                $('#lname_edit').val(data.rec['lname']);
                $('#fname_edit').val(data.rec['fname']);
                $('#mi_edit').val(data.rec['mi']);
                $('#bdate_edit').val(data.rec['bdate']);
                $('#module_edit').val(data.rec['module']);
                $('.updatemodal').modal({
                    backdrop: 'static',
                    keyboard: false
                });
            },
            error: function(jqXHR, textStatus, errorThrown) {
                alert('Error get data from ajax');
            }
        });
    });

Answer 1

You can use CodeIgniter form validations function :



 $errors = array();
if ($this->form_validation->run() == FALSE) {
   $errors['validation_error'] = validation_errors();
   echo json_encode($errors);
   exit();
}

Now in jquery:



 $(document).on('click', '#update', function() {
        console.log($(this).attr('data-registerid'));
        $.ajax({
            url: "<?php echo base_url('home/get_data')?>",
            type: "POST",
            dataType: "JSON",
            data: {
                "id": $(this).attr('data-registerid')
            },
            success: function(data) {
                var myObj = JSON.parse(data);
                $('#error_div').html(myObj.validation_error);
            },
            error: function(jqXHR, textStatus, errorThrown) {
                alert('Error get data from ajax');
            }
        });
    });

Answer 2

Просмотр

<div id="myModal" class="modal fade" role="dialog">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h5 class="modal-title">Login Form</h5>
      </div>
      <div class="modal-body">

        <div id="modelError"></div>

        <form method="post" action="javascript:void(0)"> 
            <div class="input-group">
                <input type="text" name="name" id="name" placeholder="First Name">
            </div>
              <div class="input-group">
                <input type="text" name="last_name" id="last_name" placeholder="Last Name">
            </div>
            <input type="submit" id="my_form" name="Save">
        </form>
      </div>
    </div>
  </div>
</div>

Скрипт

 <script>
$('#my_form').click(function(){
  $.ajax({
        url: "<?php echo base_url('controller/function')?>",
        type: "POST",
        data: {
            'name': $('#name').val(),
            'last_name': $('#last_name').val(),
        },
        success: function(data) {
            var myObj = JSON.parse(data);           
            var msg = '<div class="alert alert-danger alert-dismissable">'+myObj.error+'</div>';
              $('#modelError').html(msg);
        },
        error: function() {
            alert('Error get data from ajax');
        }
    });       
});
</script>

Контроллер

public function insert()
{
    if(isset($this->input->post())){
        $this->form_validation->set_rules('name','Name','required');
        $this->form_validation->set_rules('last_name','Last Name','required');
        if ($this->form_validation->run() == FALSE)
        {
            $this->msg['error'] = validation_errors();
            echo json_encode($this->msg);
        }else{

            $this->your_model->insert($this->input->post());
            redirect(base_url());
        }
    }else{
        $this->load->view('view-page');
    }    
}

Answer 3

Чтобы передать статус проверки формы клиенту, используйте код ниже в вашем контроллере.Код отвечает текстом в формате json, сообщением об ошибке и уведомлением.

if ($this->form_validation->run() == FALSE) {
    $json_response['form_errors'] = $this->form_validation->error_array();
    exit(json_encode($json_response));
}

На стороне клиента, в вашем обработчике успеха jjery ajax, вы можете использовать приведенный ниже код, чтобы на стороне сервера отображался ответ о состоянииклиент.

if (data.form_errors != undefined) {
  var errors = '';
  $.each(data.form_errors, function(i, val) {
    errors = errors + "\n" + val;
  });
  if (errors != "") alert(errors);
} 
else {
  alert('no error(s) in form... submit form..');
}

Альтернатива вышеуказанному js-коду:

Для обновления статуса каждого элемента формы при их изменении используйте приведенный ниже код.Поместите его вне обработчика отправки формы.

function update_form_validation() { 
  $("input,select,textarea").on("change paste keyup", function() {
    if ($(this).is(':checkbox') == true) {
      $(this).siblings("label:last").next(".text-danger").remove();
    } else if ($(this).is(':radio') == true) {
      $(this).siblings('input[type="radio"][name="' + $(this).attr('name') + '"]:last').next(".text-danger").remove();
      $(this).next(".text-danger").remove();
    } else {
      $(this).next(".text-danger").remove();
    }
  });
}
update_form_validation();

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

if (data.form_errors != undefined) {
  $.each(data.form_errors, function(i, val) {
    if ($('input[name="' + i + '"]').is(':hidden') == false) {
      if ($('input[name="' + i + '"]').is(':radio') == true) {
        $('input[name="' + i + '"]:last').after('<div class="text-danger">' + val + '</div>');

      } else if ($('input[name="' + i + '"]').is(':checkbox') == true) {
        $('input[name="' + i + '"]').siblings("label:last").after('<div class="text-danger">' + val + '</div>');
      } else {
        $('input[name="' + i + '"]').after('<div class="text-danger">' + val + '</div>');
        $('select[name="' + i + '"]').after('<div class="text-danger">' + val + '</div>');
        $('textarea[name="' + i + '"]').after('<div class="text-danger">' + val + '</div>');
      }
    }
  });
} else {
  alert('no errors in form... submit form..');
}