使用codeigniter的Ajax用户名可用性

时间:2011-03-22 07:49:58

标签: php ajax codeigniter jquery

Tankauth已经有内置功能来检查用户名是否可用。 该功能位于库和模型中。

库函数

function is_username_available($username)
{
    return ((strlen($username) > 0) AND $this->ci->users->is_username_available($username));
}

模型中的功能

function is_username_available($username)
{
    $this->db->select('1', FALSE);
    $this->db->where('LOWER(username)=', strtolower($username));

    $query = $this->db->get($this->table_name);
    return $query->num_rows() == 0;
}

现在我想使用jquery通过post方法进行一些ajax检查。 我想知道最好的方法..

我应该在控制器中创建一个新功能来检查用户名是否可用? 请告诉我,url jquery必须向哪个帖子请求..

<script type="text/javascript">
$(document).ready(function()
{

$("#username").change(function()
{
var username = $("#username").val();
var msgbox = $("#status");

if(username.length > 3)
{
$("#status").html('<img src="images/loader.gif">&nbsp;Checking availability.');

$.ajax({
type: "POST",
url: "/index.php/auth/user_availability",
data: "username="+ username,
success: function(msg){
$("#status").ajaxComplete(function(event, request){

if(msg == 'OK')
{

$("#username").removeClass("red"); 
$("#username").addClass("green");
msgbox.html('<img src="yes.png"> <font color="Green"> Available </font>');
}
else
{

$("#username").removeClass("green"); 
$("#username").addClass("red"); 
msgbox.html(msg);
}
});
}
});

}
else
{

$("#username").addClass("red"); 
$("#status").html('<font color="#cc0000">Enter valid User Name</font>');
}
return false;
});
});
</script>

谢谢!

2 个答案:

答案 0 :(得分:4)

我倾向于创建一个名为 ajax 的控制器,它基本上保存了我所有与ajax相关的函数。这样我现在总能指向我的ajax调用:

<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');

class Ajax extends CI_Controller {

    public function __construct()
    {
        parent::__construct();
    }

    public function index()
    {
        $this->output->set_output("This is an AJAX endpoint!");
    }

    public function user_availability()
    {
        $this->load->model("users");
        $res = $this->users->is_username_available( $this->input->post("username") );
        if( $res )
            $this->output->set_output("OK");
        else    
            $this->output->set_output("NOT OK");
    }
}

/* End of file welcome.php */
/* Location: ./application/controllers/ajax.php */

制作完这个控制器后,你可以随时创建更多的ajax调用,如果你需要的话,它们都在同一个地方。

然后你的jQuery ajax调用需要改为:

...
$.ajax({
type: "POST",
url: "/index.php/ajax/user_availability",
data: "username="+ username,
---

我希望这可以让您了解解决方案。

答案 1 :(得分:0)

您可以向服务器上的页面发出Ajax请求以检查用户名是否可用,即使不使用JQuery也可以这样做,而是使用纯JavaScript和XMLHttpRequest对象,因为所有现代浏览器都支持Ajax。您可以在特定事件中请求此页面,即当用户在文本框中键入他/她的名字时,或者在输入名称时文本框失去焦点等等。

从服务器请求数据库中名称可用性的方法如下。纯粹使用JavaScript和Ajax。 (注意,在示例方法中,我使用了JSP页面和POST的intead,我使用了GET方法,因为要请求的数据不敏感,因此可以不加密地调用)

function requestUserInfo(x)
{
    var url = "./CheckAvailability.jsp?id=";
    var xhr = false;
    if(window.XMLHttpRequest) //Standard object that works with every browser except for IE
    {
        xhr = new XMLHttpRequest();
    }
    else if(window.ActiveXObject) //Use IE specific object if IE is the browser
    {
        xhr = new ActiveXObject("Microsoft.XMLHTTP");
    }
    function handleHttpResponse()
    {
        var results=xhr.responseText; //Store the response received from CheckAvailability.jsp
        if(results.trim()=="0") //The CheckAvailability.jsp page will return 0 is user name exists
        {
                //Your code to perform something if user name exists
        }
        else
        {
                //Your code to perform something if user name does not exist
        }
    }
    var sId = x.value;
    xhr.open("GET", url + escape(sId), true);
    xhr.onreadystatechange = handleHttpResponse;
    xhr.send(null);
}

方法requestUserInfo(x)接受我们将调用此方法的控件的引用,并将请求以下页面CheckAvailability.jsp

<%@ page import="java.sql.*" import="java.io.*" import="java.util.*" %>
//The following code checks for User name existence in a table stored in MySQL
<% 
try
{

        Class.forName("com.mysql.jdbc.Driver");
        Connection cn=DriverManager.getConnection("jdbc:mysql://127.0.0.1:3306/MyDatabase?user=;password=","myuser","mypass");
        Statement st=cn.createStatement();
        String user=request.getParameter("id");
        ResultSet rs=st.executeQuery("select * from users where usernm='"+user+"'");
        if(rs.next()) //Check if User Already Exists
        {
            //Return "0" if Exists
            out.print("0");
        }
        else
        {
            //Return "1" if User name does not exist
            out.print("1");
        }
        st.close();
        cn.close();

}   
catch(Exception e)
{
    out.println(e);
}
%>