当服务器端验证失败时，Codeigniter 在 JQuery Colorbox 中重新填充表单答案

【问题标题】：Codeigniter Re-populate form in JQuery Colorbox when serverside validation fails当服务器端验证失败时，Codeigniter 在 JQuery Colorbox 中重新填充表单
【发布时间】：2013-02-16 07:58:46
【问题描述】：

我正在创建一个基本的 CRUD。除了表格重新填充外，一切正常。这是我在做什么的详细信息。

我正在显示所有员工的列表。有一些链接添加新的。并与每个员工一起编辑和删除。现在在 Add New 或 Edit 我填充 jquery Colorbox 并在其中加载我的表单。这是点击我的控制器方法的链接。

<a 
    href="<?php echo site_url('employees/form/'.$employee['id']);?>" 
    id="popUpEditFormTrigger" 
    return="<?php echo site_url('employees/entries'); ?>"
>Add New</a>

正如您在此处看到的，我正在使用控制器方法来加载表单。这工作正常。在彩盒 form.js 中有一些代码。

var dataString = $('#updateForm').serialize();
var url = $('#updateForm').attr('url');
$.ajax({
    type: "POST",
    url: url,
    data: dataString,
    success: function() {                
        $.fn.colorbox.close();                
    }
}); 
return false;

当 ajax 成功时它会关闭颜色框。 return false 防止列表视图走得更远，然后

return="<?php echo site_url('employees/entries'); ?>"

运行并刷新表中的条目。

控制器

public function submit()
{
    $this->load->library('form_validation');

    $this->form_validation->set_rules('name',' Employee Name'.'trim|required');
    $this->form_validation->set_rules('salary',' Salary'.'trim|required');
    $this->form_validation->set_rules('description',' Description'.'trim|required');

    if($this->form_validation->run()){
        $data['name']           =   $post['name'];
        $data['salary']         =   $post['salary'];
        $data['description']    =   $post['description'];

        $result =   $this->employeesModel->insertEmployee($data);
    }else{
        $this->load->view('employee_form');
    }
}

问题：

问题是我想在颜色框中重新填充表单，以便我可以显示用户验证错误。但无论是否执行插入或验证失败，颜色框总是关闭。如果验证失败，我想在颜色框中再次填充表单并防止超链接属性返回到 site_url('employees/entries')。我怎样才能做到这一点？我确信 JQuery 可以处理这个，但我不知道如何。需要建议。

【问题讨论】：

Ajax 对你来说很重要吗，因为我使用 JS 来调用 url 并且它工作得很棒

标签： jquery codeigniter popup

【解决方案1】：

好的，您在这里提出的概念是导致问题的原因。如果没有验证错误，您想关闭表单。但使用成功功能并不意味着。 success function 告诉ajax request 是否已正确生成，无论php 的输出如何。所以你需要做的是......

在 php 方面：

if(ok){
$data['res'] = '1'; // which means that everything is ok
}
else{
$data['res'] = '0'; // which means that you had a problem with your validation.
}
// then pass the data in json format or any other format you need.

上面的代码只是一个示例来阐明这个想法。

那么什么是重要的......在你的 jquery 方面：

success: function(data) {                
        if(data.res == '1')
        {
            $.fn.colorbox.close();  
         }
        else
        { // display the errors
        }  
    }

所以这个成功函数告诉ajax request已经成功。所以在里面你可以检查验证是否正常。

【讨论】：

嗯 @mamdouhalramadan 这正是我现在的想法，所以我将在 colorbox.js 中添加另一个函数，它将被调用而不是 .close 关闭并调用返回。新功能将关闭颜色框并再次弹出错误。谢谢你的想法

【解决方案2】：

嘿，我不知道 Ajax，但我在我的应用程序中使用带有 JS 的颜色框。我也仅将其用于相同目的。

将您的colorbox.js 文件包含在您将调用此Add New 链接的视图文件中。

<a href="javascript:add_new('<?php echo $employee['id']  ?>')">Add new</a>

当用户点击此链接时，这将调用一个JS函数，您需要在文件末尾编写该函数。

function show_channels(employee_id) { 

$.colorbox({href:"<?php echo ROOT_FOLDER ?>/controller_name/show_channels/" + employee_id,iframe:true,width:'515px',height:'374px'});
}

现在颜色框将加载我在上述 javascript 函数中指定的 url。

现在你需要编写一个控制器函数来处理数据。

public function submit()
{
$this->load->library('form_validation');

$this->form_validation->set_rules('name',' Employee Name'.'trim|required');
$this->form_validation->set_rules('salary',' Salary'.'trim|required');
$this->form_validation->set_rules('description',' Description'.'trim|required');

if($this->form_validation->run()){
    $data['name']           =   $post['name'];
    $data['salary']         =   $post['salary'];
    $data['description']    =   $post['description'];

    $result =   $this->employeesModel->insertEmployee($data);
}else{
    $this->load->view('employee_form');
}
}

【讨论】：