我已經搜索了該網站（和谷歌），並找不到我的問題的工作解決方案。Posabsolute的jQuery驗證引擎和CkEditor

我使用Posabsolute的驗證引擎，它工作得很好。除了我的問題兒童 - 我的CKeditor格式的textareas。

我知道我需要使用CKEditor.instances.textareaid.updateElement()評估textarea，但無法使其正常工作。

任何人有任何提示/解決方案如何工作？也許在validationEngine.js中有一個我需要重寫的設置？

任何指針將是最歡迎:)

2012-09-12 AriStorm

驗證前，您可能需要使用CKEditor數據更新隱藏輸入。 – Owlvark

我已經做到了，像這樣：

  if(typeof CKEDITOR !== 'undefined'){ 
       for(var i in CKEDITOR.instances){ //editors 
       $("form textarea[name="+CKEDITOR.instances[i].name+"]").addClass("validate[required]"); 
       $("form textarea[name="+CKEDITOR.instances[i].name+"]").attr("data-prompt-position", 'bottomLeft:400,0'); 
       } 
      }

來源

2012-09-19 14:06:33 ECON

記住ValidationEngine只驗證可見字段和CKEDITOR隱藏原來的文字區域，或DIV，與visibility: hidden; display: none;內聯樣式。
由於您已經發現此代碼CKEditor.instances.textareaId.updateElement()需要將編輯器區域的內容傳回原始元素，但還需要完成更多操作。

您還需要使原始元素再次可見，並使用$('#textareaId').toggle()或$('#textareaId').show()這樣做。現在，您可以驗證這使用所有的字段：

$('#formId').validationEngine('validate');

現在另一個問題出現，錯誤提示是沒有編輯器區域附近，但在由於visibility: hidden原始的元素，但是這是沒有問題的。我們只需再次隱藏原始元素，即$('#textareaId').toggle()或$('#textareaId').hide()，以使提示與編輯器對齊。

完整代碼

該代碼使用CKEditor的V4和validationEngine V2.5。

<form id="yourFormId" onsubmit="return validate(this);"> 
<textarea id="textareaId" class="ckeditor"></textarea> 
</form> 
<script> 
function validate(form) { 
    CKEDITOR.instances.textareaId.updateElement(); 
    $('#textareaId').toggle(); 
    validated = $(form).validationEngine('validate'); 
    $('#textareaId').toggle(); 

    return validated; 
} 
</script>

如果您有多個編輯器元素，您可能需要添加一個循環。
唯一的下降與此代碼是硬編碼的原始elementId（s）。

來源

2012-12-05 15:58:56 Kim

jQuery(function() 
{ 
    CKEDITOR.replace("editor_id", 
    { 
     width:"750px", 
     height:"300px", 
     on: 
     { 
      instanceReady: function(ev) 
      { 
       jQuery("#editor_id").css({display:"block",visibility:"hidden",position:"absolute"}); 
       this.document.on("keyup", CK_jQ); 
       this.document.on("paste", CK_jQ); 
      } 
     } 
    }); 
}); 

function CK_jQ() 
{ 
    CKEDITOR.tools.setTimeout(function() 
    { 
     jQuery("#editor_id").val(CKEDITOR.instances.editor_id.getData()); 
    }, 0); 
} 

function validateFrm() 
{ 
    if(JQObj('#'+frmID).validationEngine('validate')) 
    { 
     return true; 
    } 
    else 
    { 
     return false; 
    } 
}

//你的HTML像下面

形式方法= 「郵報」 NAME = 「formId」 ID = 「formId」行動= 「」 ENCTYPE = 「的multipart/form-data的」的onsubmit = 「return validateFrm（'formId'）;」

來源

2013-09-30 09:24:42

我寧願使用一些CSS技巧來代替。我會用這個樣式的文本區域

.wysiwyg-editor{ 
    visibility: hidden !important; 
    display: block !important; 
    height: 0px; 
}

我認爲這是一個清晰的解決方案。

來源

2015-08-12 13:57:19

Posabsolute的jQuery驗證引擎和CkEditor

回答

完整代碼

相關問題