एएसपी.नेट एमवीसी 3 अविभाज्य सत्यापन, सबमिट और TinyMCE

Question

हमारे पास TinyMCE के लिए एक घर में विकसित फ़ाइल/छवि/दस्तावेज़ प्रबंधक प्लगइन है जिसे अभी भी jQuery पर पोर्ट किया जा रहा है। इस बीच, हमारी कुछ परियोजनाओं को इन सुविधाओं पर भरोसा करने के लिए TinyMCE & jQuery.noConflict() के प्रोटोटाइप-आधारित संस्करण का उपयोग करने की आवश्यकता है। यह ठीक काम करता है हालांकि एएसपी.नेट एमवीसी 3 में अविभाज्य सत्यापन के साथ सबमिट पर सत्यापन TinyMCE कॉलबैक से पहले TinyMCE की सामग्री को फॉर्म फ़ील्ड में कॉपी करने के लिए होता है। क्या अविभाज्य सत्यापन में पूर्व-प्रमाणीकरण ईवेंट में हुक करना संभव है? आप बटन प्रस्तुत उपयोग नहीं कर रहे हैं

$("input[type='submit']").click(function() { 
    tinyMCE.triggerSave(); 
}); 

, बस हुक जो कुछ में घटना प्रपत्र प्रस्तुत करने से पहले तुरंत होता है और फोन tinyMCE.triggerSave (:

Answer 1

आप बटन प्रस्तुत उपयोग कर रहे हैं फार्म पोस्ट करने के लिए, इस कोशिश)।

Answer 2

इस बारे में जाने का एक और तरीका जो आपको अधिक नियंत्रण देता है TinyMCE प्रारंभ में है। यह एक मामले को छोड़कर अच्छी तरह से काम करता है: आपके द्वारा बाहर निकलने वाला अंतिम TinyMCE उदाहरण TinyMCE के भीतर निष्क्रिय निष्क्रिय ईवेंट को ट्रिगर नहीं करता है (यह केवल तभी ट्रिगर होता है जब आप किसी अन्य TinyMCE उदाहरण पर जाते हैं)। तो यहां इस के आसपास काम करने का एक तरीका है - अब तक यह अच्छी तरह से काम करता है लेकिन वाईएमएमवी।

नोट: मैं इसका उपयोग स्वीकार किए गए उत्तर के साथ करूँगा। यह कोड सत्यापन को ट्रिगर करता है क्योंकि सामग्री को TinyMCE में संपादित किया जा रहा है।

tinyMCE.init({ 
    ... 
    setup: ValidationTinyMceSetup 
}); 

और हमारे सेटअप विधि:

function ValidationTinyMceSetup(editor) { 
    var $textarea = $('#' + editor.editorId); 

    // method to use to save editor contents to backend input field (TinyMCE hides real input and syncs it up 
    // with values on form submit) -- we need to sync up the hidden input fields and call the valid() 
    // method from jQuery unobtrusive validation if it is present 
    function save(editor) { 
     if (editor.isDirty) { 
      editor.save(); 
      var $input = $('#' + editor.editorId); 
      if (typeof $input.valid === 'function') 
       $input.valid(); 
     } 
    } 

    // Save tinyMCE contents to input field on key/up down (efficiently so IE-old friendly) 
    var typingTimerDown, typingTimerUp; 
    var triggerDownSaveInterval = 1000;  // time in ms 
    var triggerUpSaveInterval = 500;  // time in ms 

    editor.onKeyDown.add(function (editor) { 
     clearTimeout(typingTimerDown); 
     typingTimerDown = setTimeout(function() { save(editor) }, triggerDownSaveInterval); 
    }); 

    editor.onKeyUp.add(function() { 
     clearTimeout(typingTimerUp); 
     typingTimerUp = setTimeout(function() { save(editor) }, triggerUpSaveInterval); 
    }); 


    // Save tinyMCE contents to input field on deactivate (when focus leaves editor) 
    // this is via TAB 
    editor.onKeyDown.add(function (editor, event) { 
     if (event.keyCode === 9) 
      save(editor); 
    }); 

    // this is when focus goes from one editor to another (however the last one never 
    // triggers -- need to enter another TinyMCE for event to trigger!) 
    editor.onDeactivate.add(function (editor) { 
     save(editor); 
    }); 
} 

अंत में, एक बोनस आइटम है कि पूरी तरह से असंबंधित है:

function CharacterCountDisplay(current, max) { 
    if (current <= max) { 
     return current + ' of ' + max + ' characters max'; 
    } 
    else { 
     return '<span style="color: red;">' + current + '</span> of ' + max + ' characters'; 
    } 
} 

: यदि आप एक चरित्र काउंटर आपकी जावास्क्रिप्ट स्रोत में इस समारोह को शामिल करके जोड़ सकते हैं

और उपरोक्त ValidationTinyMceSetup विधि में जोड़ें:

// check for character count data-val 
var character_max = $textarea.attr('data-val-lengthignoretags-max'); 
if (typeof character_max === 'undefined' || character_max === false) { 
    character_max = $textarea.attr('data-val-length-max'); 
} 
if (typeof character_max !== 'undefined' && character_max !== false) { 
    var character_count = function (editor) { 
     var currentLength = $(editor.getDoc().body).text().length; 
     editor.dom.setHTML(tinymce.DOM.get(editor.id + '_path_row'), CharacterCountDisplay(currentLength, character_max)); 
    }; 

    // on load show character count 
    editor.onInit.add(character_count); 

    // while typing update character count 
    editor.onKeyUp.add(character_count); 
} 

उपयोग करने के लिए बस अपने टेक्स्टएरा टैग में data-val-length-max="250" जोड़ें या जो भी आप TinyMCE का उपयोग कर रहे हैं!