parsley.js不適用於ckeditor textarea

我使用parsley.js驗證器爲我的表單編寫了代碼，但是除了CKEditor textareas，它工作正常。哪裏可以解決問題？下面是截圖 parsley.js不適用於ckeditor textarea

這裏是我的代碼：

<script type="text/javascript"> 
CKEDITOR.on('instanceReady', function(){ 
     $.each(CKEDITOR.instances, function(instance) { 
     CKEDITOR.instances[instance].on("change",function(e) { 
      for (instance in CKEDITOR.instances) 
      CKEDITOR.instances[instance].updateElement(); 
     }); 
     }); 
    }); 
</script> 

<h2 class="heading">Description</h2> 
<div class="controls"> 
    <textarea name="description" id="description" required="" data-parsley-errors-container="#description-errors" data-parsley-required-message="Это поле необходимо!"></textarea> 
</div> 
<div style="margin-bottom: 20px;" id="description-errors"></div> 

<script> 
    CKEDITOR.replace('description'); 
</script> 

<h2 class="heading">Purpose</h2> 
<div class="controls"> 
    <textarea name="purpose" id="purpose" required="" data-parsley-errors-container="#purpose-errors" data-parsley-required-message="Это поле необходимо!"></textarea> 
    <div style="margin-bottom: 20px;" id="purpose-errors"></div><br><br> 
    <button type="submit" name="submit">Submit</button> 
</div> 


<script> 
    CKEDITOR.replace('purpose'); 
</script>

來源

2017-08-28 Javid Abbasov

您的問題與需要屬性有關。之後，該行：

CKEDITOR.on('instanceReady', function() {

你需要重新添加這樣的屬性，對於每一個文本區域，因爲在CKEDITOR初始化階段丟失（即：CKEDITOR.replace（「目的」）;）。

對於特定的textarea，你可以這樣寫：

$('#description').attr('required', '');

對於所有屬於形式的textareas：

$('form textarea').attr('required', '');

從您的評論：

當錯誤顯示其他輸入，當我輸入的東西會自動刪除。但在textareas它不會離開

爲了解決這部分，在CKEDITOR更改事件，您需要觸發歐芹驗證。以下線的伎倆：

$('form').parsley().validate();

更新的代碼（的jsfiddle here）：

CKEDITOR.on('instanceReady', function() { 
    $('form textarea').attr('required', ''); 
    $.each(CKEDITOR.instances, function (instance) { 
     CKEDITOR.instances[instance].on("change", function (e) { 
      for (instance in CKEDITOR.instances) { 
       CKEDITOR.instances[instance].updateElement(); 
       $('form').parsley().validate(); 
      } 
     }); 
    }); 
});

來源

2017-08-28 18:39:28 gaetanoM

你能解釋一下請，我們爲什麼要加入這樣的代碼是什麼這個代碼是什麼意思？ –

@JavidAbbasov你的textareas有** required =「」**。在CKEDITOR init中這個屬性消失了，因此你需要重新設置它，在jQuery中你可以寫：$（'＃description' ）.attr（'required'，''）;或者如果你想爲所有** $（'textarea'）。attr（'required'，''）; **讓我知道它是不是c李爾。 – gaetanoM

哦，謝謝！一切都清楚了，但仍然有一個小問題。當其他輸入中顯示錯誤時，當我鍵入內容時會自動刪除。但在textareas它不會離開https://yadi.sk/i/qEFXPqsi3MQ4PV。 –

它總是那麼容易得多，如果你提供了一個最小的工作示例回答的問題......

ckeditor隱藏<textarea>並通過Javascript填充。

也許問題是錯誤容器是在錯誤的地方。

也很有可能ckeditor不會觸發input事件（不是很知名）。如果是這種情況，下面的代碼應該解決問題：

$('textarea').on('change', function() { $(this).trigger('input') })

請更新，如果這工作與否。

來源

2017-08-28 18:12:13

它沒有工作:( –

parsley.js不適用於ckeditor textarea

回答

相關問題