jquery-ui对话框表单验证


jquery ui dialog form validation

Jquery UI对话框窗体:

我必须创建一个新网站的注册

使用:

  1. jquery用户界面
  2. php
  3. mysql
  4. Html5

问题是:

  1. 无法检查用户或电子邮件是否存在
  2. check_exist函数返回notexist值,并且它始终未定义
  3. when删除if的notexist(bValid&&notexist),效果很好
  4. 如何检查key up上是否存在电子邮件
  5. 如果出现任何错误,如何禁用注册按钮

ajax.php文件源:

require_once '../global.php';
if ($_GET['do'] == "register") {
if (isset($_POST['name'])) {
    $name = strip_tags($_POST['name']);
    $pass = strip_tags($_POST['password']);
    $ins = mysql_insert('users', array('u_name' => $name, 'password' => $pass));
    if ($ins) {
        $u_id = mysql_insert_id();
        $username = strip_tags($_POST['username']);
        $telephone = strip_tags($_POST['telephone']);
        $gender = strip_tags($_POST['gender']);
        $nationality = strip_tags($_POST['nationality']);
        $email = strip_tags($_POST['email']);
        $ins2 = mysql_insert('patient_info', 
        array(
        'u_no' => $u_id, 
        'name' => $username, 
        'gender' => $gender,
        'nationality' => $nationality,
        'tel' => $telephone,
        'email' => $email
        ));
        if ($ins2) {
            echo "Welcome  you can login now :)";
        }
    } 
}
}
if ($_GET['do'] == "userexist") {
$username = $_POST['username'];
$result = mysql_query("select * from users where u_name ='" . $username . "'");
$row = mysql_fetch_row($result);
if ($row > 0) {
    echo 1;
}else{
    echo 0;
}
}
if ($_GET['do'] == "mailexist") {
$email = $_POST['email'];
$result = mysql_query("select * from patient_info where email ='" . $email . "'");
$row = mysql_fetch_row($result);
if ($row > 0) {
    echo 1;
}else{
    echo 0;
}
}

js文件源:

$(function() {
$("#gender").buttonset();
var info = $('#notfi-info').hide();
$('#notfi-error').hide();
var name = $("#name"), email = $("#email"), password = $("#password"), username = $("#username"), telephone = $("#telephone"), gender = $('#gender input[name=gender]'), nationality = $("#nationality"), allFields = $([]).add(name).add(email).add(password).add(username).add(telephone).add(password).add(nationality), tips = $("#validateTips");
function getradio(r) {
    if (r.filter(':checked')) {
        if (r.filter(':checked').val() == "male" || r.filter(':checked').val() == "female") {
            return r.filter(':checked');
        }
    } else {
        return false;
    }
}
function updateTips(t) {
    tips.text(t).addClass("ui-state-highlight");
    setTimeout(function() {
        tips.removeClass("ui-state-highlight", 1500);
    }, 500);
}
function checkLength(o, n, min, max) {
    if (o.val().length > max || o.val().length < min) {
        o.addClass("ui-state-error");
        updateTips("Length of " + n + " must be between " + min + " and " + max + ".");
        return false;
    } else {
        return true;
    }
}
function checkRegexp(o, regexp, n) {
    if (!( regexp.test(o.val()) )) {
        o.addClass("ui-state-error");
        updateTips(n);
        return false;
    } else {
        return true;
    }
}
function check_exist(x, y, z, k) {
    jQuery.ajax({
        type : "POST",
        url : "inc/ajax.php?do=" + z,
        data : y + '=' + x.val(),
        cache : false,
        success : function(response) {
            if (response == "1") {
                x.addClass("ui-state-error");
                updateTips(k);
                return false;
            }
            if (response == "0") {
                return true;
            }
        }
    });
}
function subregform(form) {
    jQuery.ajax({
        type : form.attr("method"),
        url : form.attr("action"),
        data : form.serialize(),
        success : function(msg) {
            info.find(".info").text(msg);
            info.toggle();
            $(this).dialog("close");
        },
        error : function() {
            alert("failure");
        }
    });
}

$("#dialog-form").dialog({
    autoOpen : false,
    height : 450,
    width : 400,
    modal : true,
    buttons : {
        "Create an account" : function() {
            var bValid = true;
            allFields.removeClass("ui-state-error");
            bValid = bValid && checkLength(name, "login name", 3, 16);
            bValid = bValid && checkLength(email, "Email", 6, 80);
            bValid = bValid && checkLength(password, "Password", 5, 16);
            bValid = bValid && checkLength(username, "Username", 5, 16);
            bValid = bValid && checkLength(telephone, "Telephone", 7, 13);
            // bValid = bValid && checkLength(getradio, "Gender", 4, 5);
            bValid = bValid && checkLength(nationality, "Nationality", 3, 25);
            bValid = bValid && checkRegexp(telephone, /^[0-9]([0-9])+$/i, "Telephone may consist of 0-9 only.");
            // bValid = bValid && checkRegexp(name, /^[a-z]([0-9a-z_])+$/i, "Username may consist of a-z, 0-9, underscores, begin with a letter.");
            // From jquery.validate.js (by joern), contributed by Scott Gonzalez: http://projects.scottsplayground.com/email_address_validation/
            bValid = bValid && checkRegexp(email, /^((([a-z]|'d|[!#'$%&''*'+'-'/='?'^_`{'|}~]|['u00A0-'uD7FF'uF900-'uFDCF'uFDF0-'uFFEF])+('.([a-z]|'d|[!#'$%&''*'+'-'/='?'^_`{'|}~]|['u00A0-'uD7FF'uF900-'uFDCF'uFDF0-'uFFEF])+)*)|(('x22)(((('x20|'x09)*('x0d'x0a))?('x20|'x09)+)?((['x01-'x08'x0b'x0c'x0e-'x1f'x7f]|'x21|['x23-'x5b]|['x5d-'x7e]|['u00A0-'uD7FF'uF900-'uFDCF'uFDF0-'uFFEF])|(''(['x01-'x09'x0b'x0c'x0d-'x7f]|['u00A0-'uD7FF'uF900-'uFDCF'uFDF0-'uFFEF]))))*((('x20|'x09)*('x0d'x0a))?('x20|'x09)+)?('x22)))@((([a-z]|'d|['u00A0-'uD7FF'uF900-'uFDCF'uFDF0-'uFFEF])|(([a-z]|'d|['u00A0-'uD7FF'uF900-'uFDCF'uFDF0-'uFFEF])([a-z]|'d|-|'.|_|~|['u00A0-'uD7FF'uF900-'uFDCF'uFDF0-'uFFEF])*([a-z]|'d|['u00A0-'uD7FF'uF900-'uFDCF'uFDF0-'uFFEF])))'.)+(([a-z]|['u00A0-'uD7FF'uF900-'uFDCF'uFDF0-'uFFEF])|(([a-z]|['u00A0-'uD7FF'uF900-'uFDCF'uFDF0-'uFFEF])([a-z]|'d|-|'.|_|~|['u00A0-'uD7FF'uF900-'uFDCF'uFDF0-'uFFEF])*([a-z]|['u00A0-'uD7FF'uF900-'uFDCF'uFDF0-'uFFEF])))'.?$/i, "eg. ui@jquery.com");
            // bValid = bValid && checkRegexp(password, /^([0-9a-zA-Z])+$/, "Password field only allow : a-z 0-9");
            var notexist = true;
            notexist = notexist && check_exist(name, 'username', 'userexist', 'Login Name Already Exist!');
            notexist = notexist && check_exist(email, 'email', 'mailexist', 'E-Mail Already Exist!');
            if (bValid && notexist) {
                var form = $('#dialog-form form');
                subregform(form);
                // $("#users tbody").append("<tr>" + "<td>" + name.val() + "</td>" + "<td>" + email.val() + "</td>" + "<td>" + password.val() + "</td>" + "<td>" + username.val() + "</td>" + "<td>" + telephone.val() + "</td>" + "<td>" + gender.filter(':checked').val() + "</td>" + "<td>" + nationality.val() + "</td>" + "</tr>");
                $(this).dialog("close");
            }
        },
        Cancel : function() {
            $(this).dialog("close");
        }
    },
    close : function() {
        allFields.val("").removeClass("ui-state-error");
    }
});
$("#create-user").button().click(function() {
    $("#dialog-form").dialog("open");
});
});

你不应该有=,它应该是:,并使它成为一个对象:

function check_exist(x, y, z, k) {
jQuery.ajax({
    type : "POST",
    url : "inc/ajax.php?do=" + z,
    data : {y:x.val()},
    cache : false,
    success : function(response) {
        if (response == "1") {
            x.addClass("ui-state-error");
            updateTips(k);
            return false;
        }
        if (response == "0") {
            return true;
        }
    }
});

}

此外,更简单的方法是根本不包括$_GET变量,只使用if(isset($_POST[])),这样您的代码就会看起来像这样:]

url : "inc/ajax.php",
    data : {do : z, y:x.val()},
if(isset($_POST['do'])){
  if($_POST['do']=="userexist")
}

不管怎样,我相信您的问题是data参数,但是,您的mysql语句可能还有另一个问题。让我知道这种改变是否有效。。。如果没有,打开firebug或inspector,转到network选项卡,单击按钮检查用户是否存在,然后查看服务器的响应。

data :{do : z, y:x.val()} 给我do=userexist&y=致命

然后我尝试了这个:

data : {'do' : z, y:x.val()},

并返回do=userexist&y=平均

然后我试着data :'do='+ z +'&'+ y +'='+ x.val(),它返回do=userexist&username=john

它现在正在工作,但主要问题是:notexist不是真正的

        var notexist = true;
        notexist = notexist && check_exist(name, 'username', 'userexist', 'Login Name Already Exist!');
        notexist = notexist && check_exist(email, 'email', 'mailexist', 'E-Mail Already Exist!');
        if (bValid && notexist) `