如果用户名不可用,如何禁用表单提交

时间:2010-05-19 10:42:48

标签: php javascript jquery html ajax

我已检查过用户名可用性。问题是,即使用户名不可用,表单也会发布。

已编辑的代码:

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

$("#emailch").change(function() { 

    var usr = $("#emailch").val();
    if(usr.length >= 3)
    {
        $("#status").html('<img src="images/loader.gif" align="absmiddle">&nbsp;Checking availability...');
        $.ajax({  
            type: "POST",  
            url: "includes/check.php",  
            data: "username="+ usr,  
            success: function(msg){   
                $("#status").ajaxComplete(function(event, request, settings){ 
                    if(msg == 'OK')
                    { 
                        $("#username").removeClass('object_error'); // if necessary
                        $("#username").addClass("object_ok");
                        $(this).html('&nbsp;<img src="images/tick.gif" align="absmiddle">');

                    }
                    else
                    {
                        $("#username").removeClass('object_ok'); // if necessary
                        $("#username").addClass("object_error");
                        $(this).html(msg);


                    }

                });

            }
        }); 
    }

    else
    {
        $("#status").html('<font color="red">The username should have at least <strong>3</strong> characters.</font>');
        $("#username").removeClass('object_ok'); // if necessary
        $("#username").addClass("object_error");
    }

});

});
</SCRIPT>

我想要的是,如果用户名不可用,则不应发布表单。我试过在IF CONDITION中使用return false;但它失败了。请建议任何替代方法。任何帮助将不胜感激。

3 个答案:

答案 0 :(得分:1)

关于提交返回false无论如何,如果字段是好的,你的ajax发送表单,如果它不好,错误或任何你需要的

<form action="http://www.google.com" id="formId" method="post">
<input type="text" id="emailch" name="emailch" />
<input type="submit" />
</form>


<script type="text/javascript">

$(document).ready(function(){

    $("#formId").submit( function() { 

        if( $("#emailch").val().length >= 3){
            alert( 'the form is going to post via ajax here' );
        }else{
            alert( 'user name invalid error out or whatever you need to do.' );
        }
        return false;
    });
});
</script>

答案 1 :(得分:1)

使用return false来停止提交表单在jQuery中确实不能很好地工作。请改用event.preventDefault(),尝试这样的事情:

$(function() {
    $('#formid').submit(function(event) {
        if ($("#emailch").val().length < 3) {
            event.preventDefault();
        }
    });
});

答案 2 :(得分:0)

如果用户名不可用,请将success函数中的标志(变量)设置为false(例如)。然后在表单的onsubmit处理程序中检查该标志,如果该标志等于false,则从该事件处理程序返回false,并且您的表单将不会提交。