weixin_33691598 2017-01-06 18:42 采纳率: 0%
浏览 31

登录AJAX和codeigniter

I am trying to incorporate AJAX into my work. I want it to log the user in once the login button has been pressed. Below is the relevant code. The view is calling the login function in my controller.

View

<form id="loginform" class="navbar-form navbar-right" action="https://siteurl/CI/index.php/postedLinks/login" method="post" role="search">
  <div class="form-group">
    <input type="text" name="username" class="form-control" placeholder="Username">
    <input type="password" name="password" class="form-control" placeholder="Password">
  </div>
  <button type="submit" class="btn btn-default">Login</button>
</form>

Controller

public function login(){
$this->form_validation->set_rules('username','Username', 'trim|required');
$this->form_validation->set_rules('password','Password', 'trim|required|callback_check_login');
if ($this->form_validation->run()==false) {
$data['links'] = $this->links_model->get_links();
$this->load->view('postedLinks', $data);

}else{
    redirect(site_url('postedLinks'), 'refresh');
}}

public function check_login($password){

    $username = $this->input->post('username');
    $result = $this->links_model->login($username,$password);
    if ($result) {
        $sess_array = array();
        foreach ($result as $row) {
            $sess_array = $arrayName = array('id' => $row->id, 'username' => $row->username);
            $this->session->set_userdata('logged_in', $sess_array);

        }
        return true;    
    } else{

        $this->form_validation->set_message('check_login', 'Invalid Username or Password');
        return false;
    }
}

It works perfectly however I need to add ajax into it however when I attempt it never works. Any help is appreciated. Below is what I have attempted to place in my view.

$(document).ready(function() {

  // process the form
  $('#loginform').submit(function(event) {

      // get the form data
      // there are many ways to get this data using jQuery (you can use the class or id also)
      // process the form

      $.ajax({
      url : "https://siteurl/CI/index.php/postedLinks/login"
      type : "POST",
      dataType : "json",
      data : {"username" : username, "password" : password},
      success : function(data) {
          // do something
      },
      error : function(data) {
          // do something
      }
  });
      // stop the form from submitting the normal way and refreshing the page
      event.preventDefault();
  });

  • 写回答

3条回答 默认 最新

  • weixin_33712881 2017-01-06 19:24
    关注

    You've not modified the javascript in any way to show us your attempt. The code below should work to pass the username and password to the login controller but you'll need to decide what to do once the user is logged in. You'll also have to output some JSON from the login controller to tell it the login has been successful. Note, I've added ID tags to the HTML form to select the input values via jQuery.

    <html>
        <head>
            <link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
        </head>
        <body>
            <form id="loginform" class="navbar-form navbar-right" action="https://siteurl/CI/index.php/postedLinks/login" method="post" role="search">
              <div class="form-group">
                <input id="uname" type="text" name="username" class="form-control" placeholder="Username">
                <input id="pass" type="password" name="password" class="form-control" placeholder="Password">
              </div>
              <button type="submit" class="btn btn-default">Login</button>
            </form> 
    
            <script>
                document.addEventListener("DOMContentLoaded", function(event) { 
    
                  // process the form
                  $('#loginform').submit(function(event) {
    
                      // get the form data
                      // note, I've added ID tags to your form above
    
                    var u = $('#uname').val();
                    var p = $('#pass').val();
    
                      $.ajax({
                          url : "https://siteurl/CI/index.php/postedLinks/login", //enter the login controller URL here
                          type : "POST",
                          dataType : "json",
                          data : {
                              username : u, 
                              password : p
                              },
                          success : function(data) {
                              // do something, e.g. hide the login form or whatever
                              alert('logged in');
                          },
                          error : function(data) {
                              // do something
                              alert('pooped the bed');
                          }
                      });
                      // stop the form from submitting the normal way and refreshing the page
                      return false;
                  });
                }); 
            </script>
    
            <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
            <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
        </body>
    </html>
    
    评论

报告相同问题?

悬赏问题

  • ¥15 运动想象脑电信号数据集.vhdr
  • ¥15 三因素重复测量数据R语句编写,不存在交互作用
  • ¥15 微信会员卡等级和折扣规则
  • ¥15 微信公众平台自制会员卡可以通过收款码收款码收款进行自动积分吗
  • ¥15 随身WiFi网络灯亮但是没有网络,如何解决?
  • ¥15 gdf格式的脑电数据如何处理matlab
  • ¥20 重新写的代码替换了之后运行hbuliderx就这样了
  • ¥100 监控抖音用户作品更新可以微信公众号提醒
  • ¥15 UE5 如何可以不渲染HDRIBackdrop背景
  • ¥70 2048小游戏毕设项目