简体   繁体   English

在codeigniter中使用ajax和jquery检查用户名的可用性

[英]check availability of the username using ajax and jquery in codeigniter

Here I am trying to check that username input is available for the user or not. 在这里,我试图检查用户名输入是否对用户可用。 I am doing it in codeigniter. 我在codeigniter中做。 Here is my view page: 这是我的查看页面:

<html>
<head>
    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script type="text/javascript" src="http://jzaefferer.github.com/jquery-validation/jquery.validate.js"></script>
    <style type="text/css">
        .no{color:red;}
        .yes{color:green;}
    </style>
    <script>
        $(document).ready(function(){
                // unique user name checking ------------- starts here----------------
                $("#username").blur(function(){
                        var form_data= {
                            action : 'check_username',
                            username : $(this).val
                        };

                        $.ajax({
                                type: "POST",
                                url : "check_unique_username",
                                data : form_data,
                                success : function(result) {
                                    $("#message").html(result.message);
                                    alert(result);
                                }
                        });
                });
                // unique username checking -------------- ends here-----------------
        });  

    </script>
</head>
<body>
    <form class="RegistrationForm" id="RegistrationForm" method="POST" action="">
        <label for="username">User Name</label>
        <div>
            <input id="username" name="username" size="25" class="required" />
        </div>
        <input type="button" id="button1" name="button1" value="check availability" />
        <div id="message"></div>
    </form>
</body>

here is my controller code : 这是我的控制器代码:

<?php
class Registration extends MX_controller {
    function index(){
        $this->load->view('registrationPage');  // this will load the registration page.
    }
    function unique_username() {
        $action = $_POST['action'];
        if($action=='check_username'){
            $u = $this->input->post('username');
            $users=array("jhon","neo","margo","hacker","user123");
            if(in_array($u,$user)) {
                echo json_encode(array('message' => "It is not available!"));

            }
            else {
                echo json_encode(array('message' => "It is available!"));

            }
        }
    }
}
?>

But my code is not working, where I am getting wrong,please help me out..showing only it is available for every username 但是我的代码无法正常工作,哪里出了问题,请帮帮我。.仅显示每个用户名可用的代码

Edited : I have changed my controller code... 编辑:我已更改控制器代码...

You have not used # while using the id of the div, so use: 您在使用div的ID时尚未使用# ,因此请使用:

$("#message").html(result);

instead of $("message").html(result); 而不是$("message").html(result);

EDIT: An updated answer to an updated question. 编辑:对更新的问题的更新的答案。

It's actually pretty stupid none of us could see it, but the problem is this string: username : $(this).val . 这实际上是非常愚蠢的,我们没人能看到,但是问题是这个字符串: username : $(this).val The reason is that .val is not jQuery's method that get's the value of a text field, it should be username : $(this).val() (with brackets). 原因是.val不是jQuery的获取文本字段值的方法,它应该是username : $(this).val() (带方括号)。

This covers the first JS part, the next problem is a typo, you have url : "check_unique_username", , but it should be url : "registration/unique_username", (didn't have controller name, and had unnecessary check_ prefix while in controller the method was without it). 这涵盖了第一个JS部分,下一个问题是错字,您有url : "check_unique_username",但应该是url : "registration/unique_username", (没有控制器名称,并且在输入时没有不必要的check_前缀)控制器的方法是没有它)。

Next typo is in PHP - if(in_array($u,$user)) { , but we have an array $users , so change this to if(in_array($u,$users)) { , so PHP would not throw a notice. 下一个错字在PHP中if(in_array($u,$user)) { ,但是我们有一个数组$users ,因此将其更改为if(in_array($u,$users)) { ,因此PHP不会抛出注意。

Next problem is the missing line dataType: 'json', in AJAX request. 下一个问题是AJAX请求中缺少dataType: 'json', We must put it so that JS could know what data type we are receiving and parse it in a correct way. 我们必须放置它,以便JS可以知道我们正在接收的数据类型并以正确的方式对其进行解析。

After that it should work. 在那之后它应该工作。 But I have some suggestion for you. 但我对你有一些建议。 Change the PHP, so that it would return not strings, but a boolean value. 更改PHP,以便它不返回字符串,而是一个布尔值。 For example - true, if it's available, false if it's not. 例如,如果为true,则为true;否则为false。

if(in_array($u,$users)) {
    echo json_encode(array('message' => false));
} else {
    echo json_encode(array('message' => true));
}

That way it would be easier to manipulate this data in your JS code. 这样,在您的JS代码中操作该数据将更加容易。 For example you could add this code to the success part of your AJAX request: 例如,您可以将此代码添加到AJAX请求的成功部分:

success : function(result) {
    if(result.message) { 
        $("#message").html("It's available!");
        $("#button1").removeAttr('disabled');
    } else {
        $("#message").html("It's not available!");
        $("#button1").attr('disabled','disabled');
    }
}

And you will have your submit button enabled/disabled. 然后,您将启用/禁用提交按钮。 This will make sure a normal user would not be able to submit the form if he entered a username that is taken. 这将确保普通用户输入输入的用户名后将无法提交表单。

Also I would change the event blur to keyup , that way you will have faster updates, but it's a bit more heavy on the server. 另外,我会将事件blur更改为keyup ,这样您将可以更快地进行更新,但是在服务器上它的工作量更大。 Problem with blur event is that your user could fill the username and click on the button anyway, because blur event fires only after the user leaves the element. blur事件的问题在于您的用户仍然可以填写用户名并单击按钮,因为模糊事件仅在用户离开元素后才触发。

Hope this helps! 希望这可以帮助!

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM