Question

我正在进行两步注册。我已经完成了第一步，现在我正在做第二步。我想进行ajax表单验证，但是它会立即打开页面错误并且错误位于页面顶部

同时按下提交按钮，即使空字段也没有错误。

以下是我的观点：

SELECT 
   P.ProductID, 
   P.Quantity, 
   SUM(OL.Amount)
FROM atbl_Sales_Products AS P
LEFT JOIN atbl_Sales_OrdersLines AS OL ON OL.ProductID = P.ProductID 
GROUP BY P.ProductID, P.Quantity
--based on comment
HAVING SUM(OL.Amount) > P.Quantity

这是我的控制器：

<div id="messages"></div>

        <?php $attributes = array('class' => 'rex-forms', 'name' => 'continueregistrationform', 'id' => 'continueregistrationform'); ?>
                  <?= form_open_multipart('user/continueregistration', $attributes); ?>
        <div class="container-fluid">
            <div class="row">
                <div class="col-md-7">


                  <div class="row">
                    <div class="col-md-6 col-sm-6">
                        <div class="input-group">
                            <span class="input-group-addon"><i class="fa fa-user" aria-hidden="true"></i></span>
                            <input id="name" type="text" class="form-control" name="name" placeholder="Name" value="<?= $instructors['name']; ?>">
                        </div><br>
                    </div>
                    <div class="col-md-6 col-sm-6">
                        <div class="input-group">
                            <span class="input-group-addon"><i class="fa fa-globe" aria-hidden="true"></i></span>
                            <input id="web" type="text" class="form-control" name="web" placeholder="Web-site" value="<?= $instructors['web']; ?>">
                        </div><br>
                    </div>
                   </div> 

                   <div class="row"> 
                    <div class="col-md-6 col-sm-6">
                        <div class="input-group">
                            <span class="input-group-addon"><i class="fa fa-phone" aria-hidden="true"></i></span>
                            <input id="tel" type="text" class="form-control" name="tel" placeholder="Phone" value="<?= $instructors['phone']; ?>">
                        </div><br>
                    </div>
                    <div class="col-md-6 col-sm-6">
                        <div class="input-group">
                            <span class="input-group-addon"><i class="fa fa-map-marker" aria-hidden="true"></i></span>
                            <input id="address" type="text" class="form-control" name="address" placeholder="Address" value="<?= $instructors['address']; ?>">
                        </div><br>
                    </div>
                 </div>   
                 <div class="row">
                    <div class="col-md-6 col-sm-6">
                        <div class="input-group">
                            <span class="input-group-addon"><i class="fa fa-facebook-square" aria-hidden="true"></i></span>
                            <input id="facebook" type="text" class="form-control" name="facebook" placeholder="Facebook" value="<?= $instructors['fb']; ?>">
                        </div><br>
                    </div>


                    <div class="col-md-6 col-sm-6">
                        <div class="input-group">
                            <span class="input-group-addon"><i class="fa fa-twitter-square" aria-hidden="true"></i></span>
                            <input id="twitter" type="text" class="form-control" name="twitter" placeholder="Twitter" value="<?= $instructors['twitter']; ?>">
                        </div><br>
                    </div>
                  </div>

                  <div class="row">
                    <div class="col-md-6 col-sm-6">
                        <div class="input-group">
                            <span class="input-group-addon"><i class="fa fa-youtube-square" aria-hidden="true"></i></span>
                            <input id="youtube" type="text" class="form-control" name="youtube" placeholder="Youtube" value="<?= $instructors['youtube']; ?>">
                        </div><br>
                    </div>
                    <div class="col-md-6 col-sm-6">
                        <div class="input-group">
                            <span class="input-group-addon"><i class="fa fa-instagram" aria-hidden="true"></i></span>
                            <input id="instagram" type="text" class="form-control" name="instagram" placeholder="Instagram" value="<?= $instructors['instagram']; ?>">
                        </div><br>
                    </div>
                  </div> 


                 <div class="row">
                    <div class="col-md-12 col-sm-12">
                        <div class="col-md-12 input-group" id="textareadescp">
                            <textarea name="insdescription" class="form-control" rows="5" id="profiledesc" placeholder="Description"><?= $instructors['description']; ?></textarea>
                        </div><br><br>
                    </div>
                    <!-- <script>
                        CKEDITOR.replace('profiledesc');
                    </script> -->
                  </div>



                  <div class="row">
                    <div class="col-md-8 col-sm-12">
                        &nbsp;
                    </div>
                    <div class="col-md-4">
                        <div class="modal-footer btncolor">
                    <button type="submit" name="submit" id="submit" class="rex-bottom-medium rex-btn-icon">
                        <span class="rex-btn-text">Submit</span>
                        <span class="rex-btn-text-icon"><i class="fa fa-arrow-circle-o-right"></i></span>
                    </button>  
                  </div>
                        </div>
                    </div>
                </div>

            </div>
        </div>
        </form>

这里是ajax形式：

function continueregistration() {



        //set validation rules

        $validator = array('success' => false, 'messages' => array());

        $validate_data = array(
            array(
                'field' => 'name',
                'label' => 'name',
                'rules' => 'trim|required|min_length[2]|max_length[30]'
            ),
            array(
                'field' => 'web',
                'label' => 'web adress',
                'rules' => 'trim|required|valid_url|prep_url|min_length[3]'
            ),
            array(
                'field' => 'facebook',
                'label' => 'facebook adress',
                'rules' => 'trim|valid_url|prep_url|min_length[3]'
            ),
            array(
                'field' => 'twitter',
                'label' => 'twitter adress',
                'rules' => 'trim|valid_url|prep_url|min_length[3]'
            ),
            array(
                'field' => 'twitter',
                'label' => 'twitter adress',
                'rules' => 'trim|valid_url|prep_url|min_length[3]'
            ),
            array(
                'field' => 'youtube',
                'label' => 'youtube adress',
                'rules' => 'trim|valid_url|prep_url|min_length[3]'
            ),
            array(
                'field' => 'instagram',
                'label' => 'instagram adress',
                'rules' => 'trim|valid_url|prep_url|min_length[3]'
            ),
            array(
                'field' => 'tel',
                'label' => 'telephone number',
                'rules' => 'trim|required|alpha_numeric_spaces|min_length[3]|max_length[30]'
            ),
            array(
                'field' => 'address',
                'label' => 'adress',
                'rules' => 'trim|required|alpha_numeric_spaces|min_length[3]|max_length[30]'
            ),
            array(
                'field' => 'insdescription',
                'label' => 'description',
                'rules' => 'trim|required|alpha_numeric_spaces|min_length[3]'
            )
        );

        $this->form_validation->set_rules($validate_data);
        $this->form_validation->set_error_delimiters('<p class="text-danger">', '</p>'); 



        $data['title'] = 'Continue Registration';
        $data['instructors'] = $this->user_model->getuserinfoforreg();

            $this->load->view('templates/header');
            $this->load->view('registration/registration', $data);
            $this->load->view('templates/footer');  


        //validate form input
        if ($this->form_validation->run() === FALSE)
        {
            // fails
            $validator['success'] = false;
            foreach ($_POST as $key => $value) {
                $validator['messages'][$key] = form_error($key);
            }

        }
        else
        {
            //insert the user registration details into database
            $data = array(
                'name' => $this->input->post('name'),
                'web' => $this->input->post('web'),
                'fb' => $this->input->post('facebook'),
                'twitter' => $this->input->post('twitter'),
                'youtube' => $this->input->post('youtube'),
                'instagram' => $this->input->post('instagram'),
                'phone' => $this->input->post('tel'),
                'address' => $this->input->post('address'),
                'description' => $this->input->post('insdescription')
            );


            $id = $this->session->userdata('id');
            // insert form data into database
            if ($this->user_model->updateUser($id, $data)) {
                    $validator['success'] = true;
                    $validator['messages'] = array();
            }
            else
            {
                // error
                $validator['success'] = false;
                $validator['messages'] = '<div class="alert alert-danger text-center">Error</div>';
            }
        }
        echo json_encode($validator);   
    }

Answer 1

在不同的功能上尝试此加载视图，然后具有单独的提交表单功能。向我们展示您的模型

<?php

class User extends CI_Controller { 

class function continueregistration() {

    $data['title'] = 'Continue Registration';
    $data['instructors'] = $this->user_model->getuserinfoforreg();

    $this->load->view('templates/header');
    $this->load->view('registration/registration', $data);
    $this->load->view('templates/footer');
}

public function submit()
{

    $json = array();

    $validate_data = array(
        array(
            'field' => 'name',
            'label' => 'name',
            'rules' => 'trim|required|min_length[2]|max_length[30]'
        ),
        array(
            'field' => 'web',
            'label' => 'web adress',
            'rules' => 'trim|required|valid_url|prep_url|min_length[3]'
        ),
        array(
            'field' => 'facebook',
            'label' => 'facebook adress',
            'rules' => 'trim|valid_url|prep_url|min_length[3]'
        ),
        array(
            'field' => 'twitter',
            'label' => 'twitter adress',
            'rules' => 'trim|valid_url|prep_url|min_length[3]'
        ),
        array(
            'field' => 'twitter',
            'label' => 'twitter adress',
            'rules' => 'trim|valid_url|prep_url|min_length[3]'
        ),
        array(
            'field' => 'youtube',
            'label' => 'youtube adress',
            'rules' => 'trim|valid_url|prep_url|min_length[3]'
        ),
        array(
            'field' => 'instagram',
            'label' => 'instagram adress',
            'rules' => 'trim|valid_url|prep_url|min_length[3]'
        ),
        array(
            'field' => 'tel',
            'label' => 'telephone number',
            'rules' => 'trim|required|alpha_numeric_spaces|min_length[3]|max_length[30]'
        ),
        array(
            'field' => 'address',
            'label' => 'adress',
            'rules' => 'trim|required|alpha_numeric_spaces|min_length[3]|max_length[30]'
        ),
        array(
            'field' => 'insdescription',
            'label' => 'description',
            'rules' => 'trim|required|alpha_numeric_spaces|min_length[3]'
        )
    );

    $this->form_validation->set_rules($validate_data);
    $this->form_validation->set_error_delimiters('<p class="text-danger">', '</p>');        

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

        foreach ($_POST as $key => $value) {
            $json['messages'][$key] = form_error($key);
        }

    } else {

        //insert the user registration details into database

        $data = array(
            'name' => $this->input->post('name'),
            'web' => $this->input->post('web'),
            'fb' => $this->input->post('facebook'),
            'twitter' => $this->input->post('twitter'),
            'youtube' => $this->input->post('youtube'),
            'instagram' => $this->input->post('instagram'),
            'phone' => $this->input->post('tel'),
            'address' => $this->input->post('address'),
            'description' => $this->input->post('insdescription')
        );


        // This does not set sessions only gets it.

        $update_user = $this->user_model->updateUser($this->session->userdata('id'), $data)

        if ($update_user)) {
            $json['success'] = true;
        } else {
            $json['messages'] = '<div class="alert alert-danger text-center">Error</div>';
        }
    }

    echo json_encode($json); 
}

}

的Ajax

$(document).ready(function() {
    $("#submit").on('click', function() {

        $.ajax({
            url: "<?php echo base_url('user/submit');?>",
            type: "POST",
            data: $("#continueregistrationform").serialize(),
            dataType: 'json',
            success:function(response) {
            console.log(response);              
                if(response.success) {
                    $("#messages").html(response.messages);

                    $("#continueregistrationform")[0].reset();
                    $(".text-danger").remove();
                    $(".form-group").removeClass('has-error').removeClass('has-success');

                }
                else {
                    $.each(response.messages, function(index, value) {
                        $("#messages").html(response.messages);

                        var element = $("#"+index);

                        $(element)
                        .closest('.form-group')
                        .removeClass('has-error')
                        .removeClass('has-success')
                        .addClass(value.length > 0 ? 'has-error' : 'has-success')
                        .find('.text-danger').remove();

                        $(element).after(value);

                    });
                }
            } // /success
        });  // /ajax

        return false;
    }); 
});

查看

<?php $attributes = array('class' => 'rex-forms',  'id' => 'continueregistrationform'); ?>
<?php echo form_open_multipart('user/submit', $attributes); ?>

<?php echo form_close();?>

Answer 2

首先检查ajax是否设置也将页眉设置为 json 你不需要创建另一个控制器

function continueregistration() {
    if(is_ajax_request()){
      //set validation rules
      $validator = array('success' => false, 'messages' => array());
      $validate_data = array(
          array(
              'field' => 'name',
              'label' => 'name',
              'rules' => 'trim|required|min_length[2]|max_length[30]'
          ),
          array(
              'field' => 'web',
              'label' => 'web adress',
              'rules' => 'trim|required|valid_url|prep_url|min_length[3]'
          ),
          array(
              'field' => 'facebook',
              'label' => 'facebook adress',
              'rules' => 'trim|valid_url|prep_url|min_length[3]'
          ),
          array(
              'field' => 'twitter',
              'label' => 'twitter adress',
              'rules' => 'trim|valid_url|prep_url|min_length[3]'
          ),
          array(
              'field' => 'twitter',
              'label' => 'twitter adress',
              'rules' => 'trim|valid_url|prep_url|min_length[3]'
          ),
          array(
              'field' => 'youtube',
              'label' => 'youtube adress',
              'rules' => 'trim|valid_url|prep_url|min_length[3]'
          ),
          array(
              'field' => 'instagram',
              'label' => 'instagram adress',
              'rules' => 'trim|valid_url|prep_url|min_length[3]'
          ),
          array(
              'field' => 'tel',
              'label' => 'telephone number',
              'rules' => 'trim|required|alpha_numeric_spaces|min_length[3]|max_length[30]'
          ),
          array(
              'field' => 'address',
              'label' => 'adress',
              'rules' => 'trim|required|alpha_numeric_spaces|min_length[3]|max_length[30]'
          ),
          array(
              'field' => 'insdescription',
              'label' => 'description',
              'rules' => 'trim|required|alpha_numeric_spaces|min_length[3]'
          )
      );
      $this->form_validation->set_rules($validate_data);
      $this->form_validation->set_error_delimiters('<p class="text-danger">', '</p>'); 
      //validate form input
      if ($this->form_validation->run() === FALSE)
      {
          // fails
          $validator['success'] = false;
          foreach ($_POST as $key => $value) {
              $validator['messages'][$key] = form_error($key);
          }

      }
      else
      {
          //insert the user registration details into database
          $data = array(
              'name' => $this->input->post('name'),
              'web' => $this->input->post('web'),
              'fb' => $this->input->post('facebook'),
              'twitter' => $this->input->post('twitter'),
              'youtube' => $this->input->post('youtube'),
              'instagram' => $this->input->post('instagram'),
              'phone' => $this->input->post('tel'),
              'address' => $this->input->post('address'),
              'description' => $this->input->post('insdescription')
          );


          $id = $this->session->userdata('id');
          // insert form data into database
          if ($this->user_model->updateUser($id, $data)) {
                  $validator['success'] = true;
                  $validator['messages'] = array();
          }
          else
          {
              // error
              $validator['success'] = false;
              $validator['messages'] = '<div class="alert alert-danger text-center">Error</div>';
          }
      }
      //set header 
      $this->output
        ->set_content_type('application/json')
        ->set_output(json_encode($validator));
    }

  $data['title'] = 'Continue Registration';
  $data['instructors'] = $this->user_model->getuserinfoforreg();
    $this->load->view('templates/header');
  $this->load->view('registration/registration', $data);
  $this->load->view('templates/footer');  
}

在codeigniter 3中的表单验证中存在一些意外错误

2 个答案: