No se puede validar TinyMCE en asp mvc

Question

Tengo un formulario que utiliza una validación discreta. Recientemente he cambiado el área de texto para usar tiny mce y ahora la validación no funciona.
He intentado utilizar la solución de here pero no pasa nada.

$('#form input[type=submit]').click(function() { 

Nunca se ejecuta. Aquí lo que tengo:

@using (Html.BeginForm("Create", "UserAd", FormMethod.Post)) 
{ 
... 
@Html.TextAreaFor(x => x.Description, new { id = "description" })   
... 
<input type="submit" value="Create"/> 
... 

Este es el código JS:

$(document).ready(function() { 

     tinyMCE.init({ 
      mode: "textareas", 
      theme: "advanced", 
      skin: "o2k7", 
      height: "250", 
      plugins: "autolink,lists,spellchecker,pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template", 


      theme_advanced_buttons1: "bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,|,bullist,numlist", 
      theme_advanced_buttons2: "", 
      theme_advanced_buttons3: "", 
      theme_advanced_buttons4: "", 
      theme_advanced_toolbar_location: "top", 
      theme_advanced_toolbar_align: "left", 
      theme_advanced_resizing: false 
     }); 

     function toggleEditor(id) { 
      if (!tinyMCE.get(id)) { 
       tinyMCE.execCommand('mceAddControl', false, id); 
      } 
      else { 
       tinyMCE.execCommand('mceRemoveControl', false, id); 
      } 
     } 


     // new 
     $(function() { 
      var tinymce = $('#Description'); 

      tinymce.tinymce({ 
       setup: function (e) { 
        e.onInit.add(function() { 
         tinymce.css({ 
          position: 'absolute', 
          height: 0, 
          width: 0, 
          top: -100 
         }).show(); 
        }); 
       } 
      }); 

      $('#form input[type=submit]').click(function() { 
       alert('ss'); 
       tinyMCE.triggerSave(); 
      }); 
     }); 
     // makes form field highlighting work with bootstrap's css 
     $.validator.setDefaults({ 
      highlight: function (element, errorClass, validClass) { 
       $(element).closest('.control-group').addClass('error'); 
      }, 
      unhighlight: function (element, errorClass, validClass) { 
       $(element).closest('.control-group').removeClass('error'); 
      } 

     }); 
     $(function() { 
      // makes form field highlighting work with bootstrap's css on post backs 
      $('.input-validation-error').each(function (i, element) { 
       $(element).closest('.control-group').not('.error').addClass('error'); 
      }); 
     }); 

Answer 1

Usted está especificando un ID de "#form" en su selector. Intenta eliminar el # de tu selector.

por ejemplo,

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

Además, si estoy leyendo el código correcto, el TinyMCE es un elemento dinámico. Es posible que desee vincular el evento click con la función on.

por ejemplo,

$("body").on("click","#yourFormID", function(e){ 
    your click stuff here 
} 

Answer 2

El error que se obtiene es exactamente lo que dice. Debe cargar Tiny MCE (no el complemento, el trato real) antes de jQuery. Ese puede ser el problema.

¿Puedes verificar si tiny_mce.js está realmente descargado? También es posible que desee comprobar this blog. Es de alguien que también tuvo problemas con Tiny MCE.

Answer 3

Dado que TextArea se hace oculto después de aplicar el complemento tinyMce, y dado que los archivos ocultos por defecto no están validados, debe cambiar este valor predeterminado. ¿Ya ha intentado agregar:

$.validator.setDefaults({ 
ignore: '' 

});

Answer 4

Ya hay varias preguntas de stackoverflow que resolverán esto. un vistazo aquí

• Jquery validation form with TinyMCE field who gives no error by empty value
• validating multiple TinyMCE Editor