快捷導(dǎo)航

yii form 表單提交之前JS在提交按鈕的驗(yàn)證方法

更新時間：2017年03月15日 08:58:26 作者：xujing19920814

很多時候，需要對Yii表單model中的對象設(shè)置的rules進(jìn)行判斷，但是有的時候可能需要在提交之前就在客戶端進(jìn)行驗(yàn)證。怎么處理呢？接下來通過本文給大家分享yii form 表單提交之前JS在提交按鈕的驗(yàn)證方法，需要的的朋友參考下

很多時候，需要對Yii表單model中的對象設(shè)置的rules進(jìn)行判斷，但是有的時候可能需要在提交之前就在客戶端進(jìn)行驗(yàn)證，我這邊設(shè)置的方法是在提交按鈕上設(shè)置監(jiān)聽器，如果部分內(nèi)容為空（比如多選按鈕沒有選擇），那么提示出錯信息。主要目的是頁面不用提交后刷新，進(jìn)入controller的對應(yīng)函數(shù)之后再判斷出錯。顯示rules（）驗(yàn)證規(guī)則函數(shù)的錯誤信息。

這里為了驗(yàn)證是否選擇某個單選按鈕，對提交的按鈕onclick設(shè)置監(jiān)聽，具體如下

<Button onclick = "return fun()"/>

自定義fun()函數(shù)，需要有return true和false兩種情況

<script>
  function fun(){
    var CheckBox = document.getElementsByName('checkBox[]');//獲取所有的checkBox
    var count=0;
    for(i=0;i < CheckBox.length;i++){
      if(CheckBox[i].checked == true){                
        count++;
      }
    }
    if(count == 0 ){
      var errorMeg = document.getElementById('HomeworkTrConfig_flag_em_');
      errorMeg.style.display = "";
      errorMeg.innerHTML="請至少選擇一項(xiàng)";      
      return false;
    }else{
      return true;
    }
  }
</script>

補(bǔ)充：Yii表單驗(yàn)證中，提交前驗(yàn)證，不通過不提交

以前記得有這么一個寫法，就是當(dāng)表單中的內(nèi)容不符合驗(yàn)證規(guī)則時，會不允許提交，時間一長忘了怎么寫了，手冊里面也沒寫，查了一下資料，做一下筆記：

$form = $this->beginWidget('CActiveForm',array(
    'id' => 'add_host',
    'enableAjaxValidation' => false,
    'enableClientValidation' => true,
    'clientOptions' => array(
        'validateOnSubmit' => true //在這個位置做驗(yàn)證
      ),
    'focus' => array($model,'ip')
  ));
?>

以上所述是小編給大家介紹的yii form 表單提交之前JS在提交按鈕的驗(yàn)證方法，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！

您可能感興趣的文章: