CodeIgniter TankAuth ajax表单

Question

我正在使用最新版本的CodeIgniter和TankAuth，所有功能都工作正常，如登录，注销，电子邮件和注册。目前，当用户需要登录时，您会被重定向到一个单独的页面，即/auth/login。

我正在试验的是在模式中加载登录页面(使用fancybox)，而不是要求用户离开当前页面并进行登录。

我遇到的问题是，如何更改标准TankAuth设置以使用ajax提交表单，而不是提交表单然后重定向用户。

下面是来自auth/login控制器的代码：

function login()
{
    if ($this->tank_auth->is_logged_in()) {                                 // logged in
        redirect('');

    } elseif ($this->tank_auth->is_logged_in(FALSE)) {                      // logged in, not activated
        redirect('/auth/send_again/');

    } else {
        $data['login_by_username'] = ($this->config->item('login_by_username', 'tank_auth') AND
                $this->config->item('use_username', 'tank_auth'));
        $data['login_by_email'] = $this->config->item('login_by_email', 'tank_auth');

        $this->form_validation->set_rules('login', 'Login', 'trim|required|xss_clean');
        $this->form_validation->set_rules('password', 'Password', 'trim|required|xss_clean');
        $this->form_validation->set_rules('remember', 'Remember me', 'integer');

        // Get login for counting attempts to login
        if ($this->config->item('login_count_attempts', 'tank_auth') AND
                ($login = $this->input->post('login'))) {
            $login = $this->security->xss_clean($login);
        } else {
            $login = '';
        }

        $data['use_recaptcha'] = $this->config->item('use_recaptcha', 'tank_auth');
        if ($this->tank_auth->is_max_login_attempts_exceeded($login)) {
            if ($data['use_recaptcha'])
                $this->form_validation->set_rules('recaptcha_response_field', 'Confirmation Code', 'trim|xss_clean|required|callback__check_recaptcha');
            else
                $this->form_validation->set_rules('captcha', 'Confirmation Code', 'trim|xss_clean|required|callback__check_captcha');
        }
        $data['errors'] = array();

        if ($this->form_validation->run()) {                                // validation ok
            if ($this->tank_auth->login(
                    $this->form_validation->set_value('login'),
                    $this->form_validation->set_value('password'),
                    $this->form_validation->set_value('remember'),
                    $data['login_by_username'],
                    $data['login_by_email'])) { // success

                redirect('');

            } else {
                $errors = $this->tank_auth->get_error_message();
                if (isset($errors['banned'])) {                             // banned user
                    $this->_show_message($this->lang->line('auth_message_banned').' '.$errors['banned']);

                } elseif (isset($errors['not_activated'])) {                // not activated user
                    redirect('/auth/send_again/');

                } else {                                                    // fail
                    foreach ($errors as $k => $v)   $data['errors'][$k] = $this->lang->line($v);
                }
            }
        }
        $data['show_captcha'] = FALSE;
        if ($this->tank_auth->is_max_login_attempts_exceeded($login)) {
            $data['show_captcha'] = TRUE;
            if ($data['use_recaptcha']) {
                $data['recaptcha_html'] = $this->_create_recaptcha();
            } else {
                $data['captcha_html'] = $this->_create_captcha();
            }
        }
        $this->load->view('auth/login_form', $data);
    }
}

视图中的代码使用php打开并提交表单：

<?php
     $login = array(
    'name'  => 'login',
    'id'    => 'login',
    'value' => set_value('login'),
    'maxlength' => 80,
    'size'  => 30,
);
if ($login_by_username AND $login_by_email) {
  $login_label = 'Email or login';
      } else if ($login_by_username) {
    $login_label = 'Login';
    } else {
    $login_label = 'Email';
    }
    $password = array(
    'name'  => 'password',
    'id'    => 'password',
    'size'  => 30,
    );
    $remember = array(
    'name'  => 'remember',
    'id'    => 'remember',
    'value' => 1,
    'checked'   => set_value('remember'),
    'style' => 'margin:0;padding:0',
    );
    $captcha = array(
    'name'  => 'captcha',
    'id'    => 'captcha',
    'maxlength' => 8,
    );
?>
<?php echo form_open($this->uri->uri_string()); ?>
<?php echo form_submit('submit', 'Let me in'); ?>
<?php echo form_close(); ?>

就像使用$.ajax请求并将url设置为/auth/login控制器一样简单吗？如果是这样，那么我假设我还需要向auth/login控制器添加(true / false)的返回ajax数据。

任何帮助都将不胜感激。

Answer 1

好的，我完全确定codeIgniter是如何工作的，但我会告诉你整个过程，这样你就可以尝试应用它了。

然后，要发送表单，您必须在表单提交时确定目标。假设这是您的表单

<form id="target" action="destination.html"> 
   <input type="text" value="Hello there" /> 
   <input type="submit" value="Go" /> 
</form>

$('#target').submit(function() { 
    alert('Handler for .submit() called.'); 
    return false; 
}); 

这段代码将在您按下submit按钮时运行。注意:确保返回false；以停止页面刷新。

在提交函数中，您需要将POST变量发送给login处理的php文件。

$.post('doLogin.php', function(data) { 
    $('.result').html(data); 
});

所以结果应该是这样的

$('#target').submit(function() { 
        $.post('doLogin.php', function(data) { 
          $('.result').html(data); 
        }); 
   return false; 
});

为了更好地了解jQuery函数，请看一下jQuery接口。

get function to get the form

see when the form is submitted

jQuery post

这应该会帮助你开始行动