woff 發表於 2012-12-24 18:55:18

jquery validate remote的用法

項目中時常會用到一些驗證手段...由於在開發前需要對一些技術的定位!所以一般選擇固定的驗證框架和技術.
我在前台驗證中使用的是jquery_validator.這是個容易上手的框架.個人感覺它和struts2結合在一起非常不錯.下面講下使用的過程.
juery_validator可以到https://github.com/jzaefferer/jquery-validation/downloads下載
jquery_validator的介紹:
一.默認校驗規則
(1)required:true 必輸字段
(2)remote:"check.php" 使用ajax方法調用check.php驗證輸入值
(3)email:true 必須輸入正確格式的電子郵件
(4)url:true 必須輸入正確格式的網址
(5)date:true 必須輸入正確格式的日期
(6)dateISO:true 必須輸入正確格式的日期(ISO),例如:2009-06-23,1998/01/22 只驗證格式,不驗證有效性
(7)number:true 必須輸入合法的數字(負數,小數)
(8)digits:true 必須輸入整數
(9)creditcard: 必須輸入合法的信用卡號
(10)equalTo:"#field" 輸入值必須和#field相同
(11)accept: 輸入擁有合法後綴名的字符串(上傳文件的後綴)
(12)maxlength:5 輸入長度最多是5的字符串(漢字算一個字符)
(13)minlength:10 輸入長度最小是10的字符串(漢字算一個字符)
(14)rangelength: 輸入長度必須介於 5 和 10 之間的字符串")(漢字算一個字符)
(15)range: 輸入值必須介於 5 和 10 之間
(16)max:5 輸入值不能大於5
(17)min:10 輸入值不能小於10

注意如下內容:
1,遠程返回數據時,一定要返回"true"或者"false",否則就是永遠就是驗證不通過。

2,remote有兩種方式,如下就介紹remote與PHP間的驗證
(1)meta String方式(當然這種方式要引入jquery.metadata.js)
以下是我的HTML代碼


<input type="text" name="moblie" id="jform_moblie" value=""
class="input {
validate:{
    required:true,telphoneValid: true,remote:'moblie_register.php?fun=moblie',
    messages:{
      required:'請填寫手機號碼!',telphoneValid:'請輸入正確的手機號',remote:'該手機號碼已被註冊!<a href=login.php target=_blank>登錄?</a>'}}}" />
直接remote提交到PHP頁面中去。默認提交類型是GET方式提交

PHP代碼:

if ($_GET['fun']=='moblie') {//檢查手機是否已註冊   
$moblie_number=trim($_GET['moblie']);   
$exists_moblie=$db->query_first("select acc_moblie_number from t_account where acc_moblie_number='".$moblie_number."'");
if (empty($exists_moblie['acc_moblie_number'])) {
      $return['type']='true';
      $return['info']='此手機號碼可註冊!';
    }else{
      $return['type']='false';
      $return['info']='該手機號碼已被註冊!';
    }
    /*echo;*/   
exit($return['type']);}
這樣就完成的驗證

(2)rules方式


$("#Form2").validate({
    rules: {
         //定義驗證規則,其中屬性名為表單的name屬性
          "mail_account": {
             required: true,
             email: true ,
             remote: {
                url: 'checkmail.php',
                type: 'POST',
                dateType: 'json',
                data: { mail_account:function(){
                        return $('#mail_account').val();
                         }
                }
            }
         },
    },
    messages: {
      "mail_account": {
            email: "請輸入正確的郵箱地址(例如 myemail@netyea.com)",
            remote: "該郵箱已存在!"
      },
    }
});
PHP代碼:

function checkMail(){
    $mail_account = $_POST['mail_account'];
    if($this->Mail->findByMailAccount($mail_account))
      echo 'false';
    else
      echo 'true';
    die();
}

勹骜灿达 發表於 2013-11-14 00:43:30

我的啦嘿嘿

winniey 發表於 2013-11-14 00:43:30

支持~~頂頂~~~

outlet7251 發表於 2013-11-14 00:43:30

真好。。。。。。。。。
頁: [1]
查看完整版本: jquery validate remote的用法