Yii客戶端驗證和jQuery Form插件集成

我在我的項目中使用Yii框架，我想將jQuery Form plugin與Yii客戶端內置驗證一起使用。Yii客戶端驗證和jQuery Form插件集成

我無法讓他們一起工作。如果我設置jQuery form plugin這個簡單的JS代碼：

$('#myform-id').ajaxForm();

客戶端驗證進行，但是不會停止，即使驗證失敗的形式提交。我想這與Yii客戶端驗證庫和jQuery表單插件綁定窗體上的相同「提交」事件有關。

僅供參考，我仔細檢查了FireBug和Chrome控制檯沒有js錯誤。

我想知道是否有人遇到同樣的問題，並解決這個問題。

來源

2012-02-20 Fabrizio D' Ammassa

我解決了這個辦法：

Yii的活動表格初始化代碼：

<?php $form = $this->beginWidget('CActiveForm', array(
    'id'=>'user-form', 
    'enableClientValidation'=>true, 
    'clientOptions' => array(
     'validateOnSubmit'=>true, 
     'validateOnChange'=>false, 
     'afterValidate'=>'js:submiAjaxForm' 
    ) 
)); ?>

而在同一頁我已經添加了這個js代碼，通過jQuery表單插件提交表單：

function submitAjaxForm(form, data, hasError) 
{ 
    if(!hasError) 
    { 
     $('#user-form').ajaxSubmit(
     { 
      // ajax options here 
     }); 
    } 
}

來源

2012-02-21 16:02:07

試圖阻止你提交事件傳播：

$('#your-form').submit(function(e){ 
     e.stopPropagation(); 
     ... some other code ... 
});

來源

2012-02-21 12:10:40 Oleg

可惜我不能沒有黑客Yii框架的核心文件做到這一點。而且我不直接提交表單，但是jQuery表單插件可以。無論如何我解決了另一種方式。 – 2012-02-21 15:57:22

在客戶端，你可以

<?php echo CHtml::activeTextField($model, 'text', array(
                  'placeholder'=>$model->getAttributeLabel('text'), 
                  'class'=>'form-control' 
<script>             )); ?> 
function Validate(field){ 
      var _this = field; 
      var errorDiv = _this.parent().find('.errors'); 
      var attr = []; 
      _this.each(function(){ 
       var match = $(this).attr('name').match(/\[(.*?)\]/); 
       attr.push(match[1]); 
      }) 

      jQuery.ajax({ 
       type: 'POST', 
       url: 'url/', 
       data: 'ajax=keyup&'+_this.serialize()+'&attr='+attr, 
       cache: false, 
       processData: false,   
       success: function(data){ 
        data=JSON.parse(data); 
        if(data.success){ 
         _this.addClass('green'); 
         errorDiv.html(''); 

        }else{ 
         _this.addClass('red'); 
         errorDiv.html(data[attr][0]); 
        } 
       } 
      }); 
     } 
     var delay = (function(){ 
      var Timer = 0; 
      return function(callback, ms){ 
       clearTimeout (Timer); 
       Timer = setTimeout(callback, ms); 
      }; 
     })(); //if you want to delay 

     $('#traveler_info input').keyup(function(){ 
      var _this = $(this); 
      timeout = setTimeout(function(){ 
       Validate(_this,'Travelers') 
      },1000) 

     });

` 在SiteController

public function actionAjaxvalidation($type = null) 
{ 

    $model = new Travelers; 

    if(isset($_POST['Travelers'], $_POST['attr'])) 
    { 
     /* 
     * @params Model->value $attr 
     * 
     */ 
     $attr = $_POST['attr']; 

     $model->$attr = $_POST['Travelers'][$attr]; 

     if($model->validate(array($attr))) 
     { 

      echo json_encode(['success'=>true]); 

     } 
     else 
     { 
      echo json_encode($model->errors); 
     } 

     Yii::app()->end(); 
    } 
}

來源

2018-01-25 10:15:59 Nagibaba

Yii客戶端驗證和jQuery Form插件集成

回答

相關問題