登录 AJAX 和 codeigniter
Posted
技术标签:
【中文标题】登录 AJAX 和 codeigniter【英文标题】:Login AJAX and codeigniter 【发布时间】:2017-05-21 14:25:04 【问题描述】:我正在尝试将 AJAX 整合到我的工作中。我希望它在按下登录按钮后登录用户。下面是相关代码。 视图正在我的控制器中调用登录函数。
查看
<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>
控制器
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;
它工作得很好但是我需要在其中添加 ajax 但是当我尝试它时它永远不会工作。任何帮助表示赞赏。以下是我试图在我的视图中放置的内容。
$(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();
);
【问题讨论】:
所以你想在点击提交按钮时插入关于你的用户的数据? 我理解它,因为他希望通过 AJAX 执行登录表单,而不是正常的 POST 请求和随后的页面更改。 ??? 我已经编辑了链接,也是的,这就是我想要做的 【参考方案1】:您没有以任何方式修改 javascript 来向我们展示您的尝试。下面的代码应该可以将用户名和密码传递给登录控制器,但是您需要决定用户登录后要做什么。您还必须从登录控制器输出一些 JSON 来告诉它登录已经成功。注意,我在 html 表单中添加了 ID 标记,以通过 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>
【讨论】:
谢谢,我试了一下,但我得到的只是你的错误消息把床拉了起来。哈哈。如果有帮助,我将检查登录功能放在上面的 sn-p 中。【参考方案2】:your problem is your controller:
您的 ajax 代码在您的控制器中调用 function login
并将两个变量传递给它,但您的 login function
没有得到它们,登录功能必须是这样的:
public function login($Variable_one,$Variable_two)
【讨论】:
【参考方案3】:这是我使用的一种 ajax 形式的 sn-p。
$("#form1").submit(function()
var data = $("#form1").serialize();
//alert(data); return false;
$.ajax(
url: "/forms/form1",
data: data,
type: "POST",
success: function(msg)
if (msg)
$("#display").html(msg);
else
$("#display").text("nothing came back For some reason");
);
return false;
);
您序列化您的表单数据。您没有使用 json,您使用的是 post。您不需要包含您的 post 方法或 URL 的长 URL,只需使用控制器和方法,Codeigniter 自己放入 base_url。试试这个方法
您也不需要阻止默认值。只需使用 return false
【讨论】:
以上是关于登录 AJAX 和 codeigniter的主要内容,如果未能解决你的问题,请参考以下文章
使用 Phonegap、AJAX、PHP 和 mySQL 登录不工作