1

嗨，我对 jquery -ajax 很陌生，我想请一些帮助加入 CI。

我已经按照本教程使用 AJAX 提交表单，我想将此功能添加到我的 CodeIgniter 站点。我想要做的是当用户提交表单时，如果有任何验证错误需要在每个输入字段上单独显示（如在本机 ci 过程中），或者如果通过 validation_errors() 函数无法做到这一点。如果没有发生错误，则在表单上方显示成功消息。

到目前为止，这是我的代码：

我的观点

 // If validation succeeds then show a message like this, else show errors individually or in validation_errors() in a list
<div class="alert alert-success">Success!</div>
<?php echo validation_errors(); //show all errors that ajax returns here if not individualy  ?>

<?php echo form_open('admin/product/add, array('class' => 'ajax-form')); ?>
<p>
    <label for="product_name">Product *</label>
    <input type="text" name="product_name" value="<?php echo set_value('product_name', $prod->product_name); ?>" />
    <?php echo form_error('product_name'); ?>
</p>
<p>
    <label for="brand">Brand</label>
    <input type="text" name="brand" value="<?php echo set_value('brand', $prod->brand); ?>" />
    <?php echo form_error('brand'); ?>
</p>
...

我的控制器

 public function add($id){
           // set validation rules in CI native
           $rules = $this->product_model->rules;
           $this->form_validation->set_rules($rules);

           if ($this->form_validation->run() === true) {
                       // get post data and store them in db
          $data = $this->input_posts(array('product_name', 'brand', 'category_id', 'description'));
          $this->product_model->save($data, $id);
    // no errors - data stored - inform the user with display success-div
     } else {
    // validation failed - inform the user by showing the errors
     }
//load the view
$this->load->view('admin/products/add', $data);
}

这是js脚本

 $(document).ready(function () {
 $('form.ajax-form').on('submit', function() {
  var obj = $(this), // (*) references the current object/form each time
   url = obj.attr('action'),
   method = obj.attr('method'),
   data = {};

  obj.find('[name]').each(function(index, value) {
   // console.log(value);
   var obj = $(this),
    name = obj.attr('name'),
    value = obj.val();

   data[name] = value;
  });

  $.ajax({
   // see the (*)
   url: url,
   type: method,
   data: data,
   success: function(response) {
    console.log(response); // how to output success or the errors instead??
   }
  });
  return false; //disable refresh
 });
});

我应该如何通过 ajax 请求传递我的验证结果（成功或发布错误）并将它们显示在我的视图中？从我所做的一些小研究中，我发现您可以使用一个控制器，它同时包含本机进程和 ajax 请求（而不是使用 2 个控制器），但我的主要困难是，我不明白结果如何的验证将通过 js 脚本并将它们显示在我的视图中？请注意，我不想在警报框上显示任何内容，而是在 div 上显示结果或个别错误（如果可能）。

编辑我对我的应用程序做了一些更改，这是到目前为止的代码：

控制器

public function manage($id = NULL){
    $this->load->library('form_validation');

    $data['categ'] = $this->category_model->with_parents();

    //fetch a single product or create(initialize inputs empty) a new one
    if (isset($id) === true) {
        $data['prod'] = $this->product_model->get($id);
        $data['attr'] = $this->attribute_model->get_by('product_id', $id, null, true);
    } else {
        $data['prod'] = $this->product_model->make_new();
        $data['attr'] = $this->attribute_model_model->make_new();
    }

    if (isset($_POST['general_settings'])) {
        if ($this->form_validation->run('product_rules') === true) {
            // get post inputs and store them in database
            $data = $this->product_model->input_posts(array('product_name', 'brand', 'category_id', 'general_description'));
            $this->product_model->save($data, $id);

            $status = true;
        } else {
            // validation failed
            $status = validation_errors();
        }
        if ( $this->input->is_ajax_request() ) {
            echo json_encode($status);
            exit;
        }
        redirect('admin/product');
    }
    //if (isset($_POST['attributes_settings'])) { the same thing here  }                

    // load the view
    $this->load->view('admin/products/manage', $data);
}

和js

success: function(response) {
    //console.log(response);
    if (data.status === true) {
        $('#ajaxResults').addClass('alert alert-success').html(response);
    } else {
        $('#ajaxResults').addClass('alert alert-error').html(response);
    };

}

但我有一些问题

  1. 虽然当没有错误时我从 validation_errors() 收到错误消息作为警报错误，但我在警报错误中也得到了正确的信息，表示警报成功。

2.我也应该如何返回成功消息？例如。一条消息说“保存已完成！”。

  1. 尽管在非 ajax 请求中数据存储在数据库中，但如果 ajax 不存储。任何想法可能有什么问题？？？
4

2 回答 2

2

HTML：

<div id="ajaxResults"></div>

Javascript 阿贾克斯：

 success: function(response) {
    $('#ajaxResults').text(response);
   }

你写的这个脚本只有在验证成功的情况下，对吧？

错误的。每当您从服务器收到响应（假设 HTTP 标头为 200）时，都会执行“成功”中的代码。您的 javascript 是否知道服务器是否对您有任何错误？不。

您需要您的 JavaScript 来识别验证是失败还是成功。你有很多方法可以做到这一点。其中之一可能是发送消息以显示后跟 0 或 1。

所以你的 PHP 看起来像：

return "0 " . $errorMessage;

和

return "1 " . $successMessage;

然后，您的 javascript 应该使用 if 语句和 识别substring消息是否以 0 或 1 开头。

于 2013-07-17T12:01:23.350 回答
0

使用这种方式，我希望这对你有用

<script type='text/javascript'>
var base_url = '<?=base_url()?>';

function ajax_call()
{
   var ids = $("#all_users").val();

   $.ajax({
      type:"POST",
      url: base_url+"expense/home/get_expense",
      data: "userid=" + ids,
      success: function(result){
      $("#your_div_id").html(result);
 }
 });

}
</script>
于 2013-07-18T03:51:16.693 回答