Question

我正在尝试在Codeigniter中进行Ajax表单验证。

Form和Ajax都在视图/产品/添加产品中，

  <script type="text/javascript"> 
    $(document).ready(function(){
        $("#submitProducts").click(function(e){
        e.preventDefault();
        var dataString = $("#add-products-bulk-form").serialize();
        var url="products/addproducts";
        $.ajax({
            type:"post",
            url:"<?php echo base_url() ?>"+url,
            dataType: 'json',
            data:dataString,
            success:function (res) {
                res=$.parseJSON(res);
                if($.isEmptyObject(res.error)){
                    alert(res.success);
                }else{
                    console.log("hasn't run form yet");
                }
            },  
      })
    })
    });    
    </script>

这是我的产品控制器：

public function addproducts()
    {
        $data['title'] = "Add Products";
        $this->load->view('templates/header', $data);
        $this->load->view('products/addproducts');
        $this->load->view('templates/footer');
        //form rules
        //$this->form_validation->set_rules('name[]', 'Product Name', 'required');
        $this->form_validation->set_rules('partnumber[]', 'Part number', 'required|is_unique[items.itemSKU]');
        //$this->form_validation->set_rules('msrp[]', 'MSRP', 'required');
        if ($this->form_validation->run() === FALSE)
        {
            echo "did not pass validation";
            $errors = validation_errors();
            echo json_encode(['error'=>$errors]);
        }
        else
        { 
            echo "did pass validation";
            $this->product_model->add_products();
            echo json_encode(['success'=>'Record added successfully.']);
        }
    }

如果我将代码保留在上面，单击提交按钮时没有任何响应。但是，如果我删除了 dataType：'json'行，我将得到错误

VM1679:1 Uncaught SyntaxError: Unexpected token d in JSON at position 0
    at Function.parse [as parseJSON] (<anonymous>)
    at Object.success (addproducts:140)
    at i (jquery-3.1.1.min.js:2)
    at Object.fireWith [as resolveWith] (jquery-3.1.1.min.js:2)
    at A (jquery-3.1.1.min.js:4)
    at XMLHttpRequest.<anonymous> (jquery-3.1.1.min.js:4)

如果我摆脱了 dataType：'json'和 res = $。parseJSON（res），当我输入重复的产品并单击“提交”并进行控制台时.log（res），我在控制台中得到以下内容，它确实返回了res和整个页面addproducts的源代码。

    did not pass validation{"error":"<p>The Part number field must contain a unique value.<\/p>\n"}<!DOCTYPE html>
<html lang="en">
<head>

我没有在此处粘贴整个源代码。并且res.success将发出未定义的警报。

我被困了好几天，请帮忙。如果需要，我将提供更多详细信息。谢谢！

Answer 1

要清理我之前的评论...

if (response) {
    this.list= response;
    this.savedList= response.slice();
}

现在您可以使用成功回调侦听成功响应，使用错误回调侦听错误响应...

public function addproducts()
{

    //form rules
    //$this->form_validation->set_rules('name[]', 'Product Name', 'required');
    $this->form_validation->set_rules('partnumber[]', 'Part number', 'required|is_unique[items.itemSKU]');
    //$this->form_validation->set_rules('msrp[]', 'MSRP', 'required');

    header('Content-Type: application/json');

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

        $this->output->set_status_header(400);
        $errors = validation_errors();
        echo json_encode(['error'=>$errors]);
    }
    else
    {
        $this->output->set_status_header(200);
        $this->product_model->add_products();
        echo json_encode(['success'=>'Record added successfully.']);
    }
}

Answer 2

我意识到我用相同的控制器函数进行ajax调用，我将addproducts函数分为以下两个函数，并使用ajax调用ajax_add_products函数。现在有效。

public function addproducts()
    {
        $data['title'] = "Add Products";
        $this->load->view('templates/header', $data);
        $this->load->view('products/addproducts');
        $this->load->view('templates/footer');


    }

    public function ajax_add_products(){
        //form rules
        //$this->form_validation->set_rules('name[]', 'Product Name', 'required');
        $this->form_validation->set_rules('partnumber[]', 'Part number', 'required|is_unique[items.itemSKU]');
        //$this->form_validation->set_rules('msrp[]', 'MSRP', 'required');
        if ($this->form_validation->run() === FALSE)
        {
            $errors = validation_errors();
            echo json_encode(['error'=>$errors]);
        }
        else
        { 
            $this->product_model->add_products();
            echo json_encode(['success'=>'Record added successfully.']);
        }
    }

带有Codeigniter验证的Ajax表单

2 个答案: