jquery表單驗證插件怎么在Yii框架中使用-創(chuàng)新互聯(lián)

本篇文章為大家展示了jquery表單驗證插件怎么在Yii框架中使用，內容簡明扼要并且容易理解，絕對能使你眼前一亮，通過這篇文章的詳細介紹希望你能有所收獲。

目前創(chuàng)新互聯(lián)建站已為上千余家的企業(yè)提供了網站建設、域名、網絡空間、網站改版維護、企業(yè)網站設計、安龍網站維護等服務，公司將堅持客戶導向、應用為本的策略，正道將秉承"和諧、參與、激情"的文化，與客戶和合作伙伴齊心協(xié)力一起成長，共同發(fā)展。

視圖層：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"/tupian/20230522/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
  <title></title>
  <style>
  .error{
    color: red;
  }
  </style>
  <script src="js/jquery.js"></script>
  <script src="js/jquery.validate.js"></script>
  <script src="js/messages_zh.js"></script>
  <script>
// 手機號碼驗證
jQuery.validator.addMethod("phone", function(value, element) {
var length = value.length;
var mobile = /^1[3,5,8][0-9]{9}$/;
return this.optional(element) || (length == 11 && mobile.test(value));
}, "請正確填寫您的手機號碼");
// 漢字
jQuery.validator.addMethod("uName", function(value, element) {
var name= /^[\u4e00-\u9fa5]{2,6}$/;
return this.optional(element) || (name.test(value));
}, "請輸入2-4個漢字");
//驗證郵箱
jQuery.validator.addMethod("email1", function(value, element) {
  var email= /^\w+@\w+[.]com|cn|net$/;
  return this.optional(element) || (email.test(value));
}, "請正確填寫您的郵箱");
  //驗證名稱是否重復（性）
  jQuery.validator.addMethod("onlyUsername", function(value, element) {
 return eval($.ajax({
   url: "index.php?r=login/only",
   type: 'get',
   async: false,
   data: {
   u_name:value
   }
 }).responseText);
  }, "用戶名已存在");
  //驗證郵箱是否重復
  jQuery.validator.addMethod("only2", function(value, element) {
   return eval($.ajax({
     url: "index.php?r=login/only2",
     type: 'get',
     async: false,
     data: {
      email:value
     }
   }).responseText);
  }, "郵箱已存在");
  $.validator.setDefaults({
    submitHandler: function() {
     form.submit();
    }
  });
//表單驗證
$().ready(function() {
// 在鍵盤按下并釋放及提交后驗證提交表單
 $("#signupForm").validate({
  rules: {
   u_name: "required",
   u_name: {
    required: true,
    uName: true,
    onlyUsername: true
   },
   pwd: {
    required: true,
    minlength: 5
   },
   fruit:{
     required: true,
     minlength: 2
   },
    phone: {
    required: true
   },
   email: {
    required: true,
    email: true,
    email1:true,
    only2:true
   },
   sex:
   {
    required:true,
    minlength:1
   },
    topic: {
    required: "#newsletter:checked",
    minlength: 2
   },
   agree: "required"
  },
  messages: {
   u_name: "請輸入您的名字",
   u_name: {
    required: "請輸入用戶名",
    uName: "用戶名必需由2-6個漢字組成",
    onlyUsername:"用戶必須"
   },
   pwd: {
    required: "請輸入密碼",
    minlength: "密碼長度不能小于 5 個字母"
   },
   phone: {
    required: "請輸入手機號"
   },
   email: {
    required:"請輸入一個正確的郵箱",
    only2:"郵箱必須"
   },
   agree: "請接受我們的聲明",
   topic: "請選擇兩個主題",
   sex: "請至少選一個",
   fruit:"請至少選兩個水果"
  }
});
});
</script>
</head>
<body>
<center>
<form class="cmxform" id="signupForm" method="post" action="index.php?r=login/register">
 <fieldset>
  <legend>注冊頁面</legend>
  <p>
   <label for="u_name">名字</label>
   <input id="u_name" name="u_name" type="text">
  </p>
  <p>
   <label for="pwd">密碼</label>
   <input id="pwd" name="pwd" type="pwd">
  </p>
  <p>
   <label for="email">Email</label>
   <input id="email" name="email" type="email">
  </p>
  <p>
   <label for="phone">手機號</label>
   <input id="phone" name="phone" type="phone">
  </p>
  <p>
  <input type="radio" id="sex" value="男" name="sex" />男
  <input type="radio" id="sex" value="女" name="sex"/>女
  </p>
  <p>
  <select id="fruit" name="fruit[]" multiple="multiple">
  <option value="b">Banana</option>
  <option value="a">Apple</option>
  <option value="p">Peach</option>
  <option value="t">Turtle</option>
  </select>
  </p>
  <p>
   <label for="agree">請同意我們的聲明</label>
   <input type="checkbox" class="checkbox" id="agree" name="agree">
  </p>
  <p>
   <label for="newsletter">我樂意接收新信息</label>
   <input type="checkbox" class="checkbox" id="newsletter" name="newsletter">
  </p>
  <fieldset id="newsletter_topics">
   <legend>注意：如果沒有勾選“我樂意接收新信息”以下選項會隱藏，但我們這里作為演示讓它可見</legend>
   <label for="topic_marketflash">
    <input type="checkbox" id="topic_marketflash" value="學習" name="topic[]">學習
   </label>
   <label for="topic_fuzz">
    <input type="checkbox" id="topic_fuzz" value="唱歌" name="topic[]">唱歌
   </label>
   <label for="topic_digester">
    <input type="checkbox" id="topic_digester" value="跳舞" name="topic[]">跳舞
   </label>
   <label for="topic" class="error">Please select at least two topics you'd like to do.</label>
   </fieldset>
   <p>
   <input class="submit" type="submit" value="注冊">
   </p>
</form>
</center>
</body>
</html>

控制器（驗證性）：

//驗證姓名性
public function actionOnly(){
  $u_name=Yii::$app->request->get('u_name');
  $login=Yii::$app->db;
  //查詢數據
  $sql="select * from login where u_name='$u_name'";
  $res=$login->createCommand($sql)->execute();
  if($res)
  {
    echo false;
  }
  else
  {
    echo true;
  }
}

上述內容就是jquery表單驗證插件怎么在Yii框架中使用，你們學到知識或技能了嗎？如果還想學到更多技能或者豐富自己的知識儲備，歡迎關注創(chuàng)新互聯(lián)行業(yè)資訊頻道。

網站欄目：jquery表單驗證插件怎么在Yii框架中使用-創(chuàng)新互聯(lián)
標題路徑：http://jinyejixie.com/article10/csohdo.html

成都網站建設公司_創(chuàng)新互聯(lián)，為您提供網站制作、Google、小程序開發(fā)、用戶體驗、網站設計公司、服務器托管

聲明：本網站發(fā)布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內容

成人午夜视频全免费观看高清-秋霞福利视频一区二区三区-国产精品久久久久电影小说-亚洲不卡区三一区三区一区

jquery表單驗證插件怎么在Yii框架中使用-創(chuàng)新互聯(lián)