使用jquery.load在codeigniter中使用ajax验证失败后填充表单

时间:2012-06-05 07:31:20

标签: jquery ajax codeigniter validation

我已经看过很多使用jquery ajax的表单验证教程。我发现同样的事情,所有只是告诉只有成功的表格验证。如果服务器端验证失败,我需要找到如何显示错误。换句话说,当我们提交没有ajax的表单时,表单会重新填充错误消息并且输入填充了用户提供的内容。在这个方法中,我们使用一些很棒的php函数,比如form_prep。这是视图代码。

<?php // Change the css classes to suit your needs    
$attributes = array('class' => '', 'id' => 'login');
echo form_open(SITE_URL.'user/insertUser', $attributes); 
?>

<p>
<label for="username">User Name <span class="required">*</span></label>
<input type="text" name="username" maxlength="255" value="<?php echo form_prep($this->input->post('username'));?>"  />
<span id="username"><?php echo form_error('username'); ?></span><br />
</p>
<p>
<label for="first_name">First Name <span class="required">*</span></label>
<input type="text" name="first_name" maxlength="255" value="<?php echo form_prep($this->input->post('first_name'));?>"  />
<span id="first_name"><?php echo form_error('first_name'); ?></span><br />
</p>

<p>
<label for="last_name">Last Name <span class="required">*</span></label>
<input type="text" name="last_name" maxlength="255" value="<?php echo form_prep($this->input->post('last_name')); ?>"  />
<span id="last_name"><?php echo form_error('last_name'); ?></span><br />
</p>

<p>
<label for="password">Password <span class="required">*</span></label>
<input type="text" name="password" maxlength="255" value="<?php echo form_prep($this->input->post('password')); ?>"  />
<span id = "password"><?php echo form_error('password'); ?></span><br />
</p>

<p>
<label for="email">Email <span class="required">*</span></label>
<input type="text" name="email" maxlength="255" value="<?php echo form_prep($this->input->post('email')); ?>"  />
<span id = "email"><?php echo form_error('email'); ?></span><br />
</p>


<p>
<?php echo form_submit( 'submit', 'Submit', 'id="submit"'); ?>
</p>

<?php echo form_close(); ?>

您可以在此处看到使用的form_prep($ this-&gt; input-&gt; post('username')),这有助于解决安全问题。但是当我使用相同的表单在失败的验证时重新填充ajax时,它不会显示错误,也不会填充输入框。而是加载表单,就好像这是第一次加载它一样。 以下是我如何将它与ajax一起使用。

首先在div中我正在加载表单

$('#userform').load('<?php $this->load->view('user_form')?>');

现在是ajax

$(function()
{
    $('#login').submit(function()
    {
        $.ajax(
        {
            type : 'POST',
            data : $(this).serialize(),
            url  : $(this).attr('action'),
            success : function(data)
            {
                if(data == 1)
                {
                    // do something 
                }
                else
                {
                    $('#userform').load('<?php $this->load->view('user_form')?>');
                }
            }
        });
        return false;
    });
});

最后我的控制器

function insertUser()
{
    if($this->form_validation->run() == FALSE)
    {
        echo 0;
    }else{
        echo 1;
    }
}

1 个答案:

答案 0 :(得分:2)

我要做的是在控制器中渲染表单 而不是

echo 0;

just do

$html =   $this->load->view('user_form',true);
echo $html;

和 在ajax函数中 替换

else
{
    $('#userform').load('<?php $this->load->view('user_form')?>');
}

else 
{
    $('#userform').html(data);
}