Form con tinyMCE textarea con attributo html5 obbligatorio non può inviare

Question

Questa non è una domanda, ma una risposta che voglio condividere con voi. Ho appena trascorso più di quattro ore a strapparmi i capelli con qualcosa che si rivela essere un bug in TinyMCE o Firefox.

Con TinyMCE caricato, se si specifica HTML5 attributo required su un textarea forma sarà solo di non inviare in Firefox. Nessun errore, niente in Firebug, solo un ostinato rifiuto di sottomettersi.

Non so se questo è un errore FF o TinyMCE e non mi interessa. Non voglio che altri programmatori subiscano l'esasperazione che ho attraversato in queste ultime ore.

Per fare una domanda: Questo bug è documentato ovunque? Qualcuno sa?

Se questo è un post inappropriato per Stack Overflow, dimmelo e lo cancellerò.

Answer 1

Mi rendo conto che questo è stato chiesto 2 anni fa, ma sto correndo nello stesso problema, in modo da rispondere alla tua domanda:

ho trovato il bug report ufficiale qui: http://www.tinymce.com/develop/bugtracker_view.php?id=5671

Answer 2

Il problema è lontano da essere un problema di Firefox. Infatti Chrome e Opera (la "vecchia" opera prima del "cervello" è stata trapiantata con Chrome) e probabilmente ogni altro browser moderno potrebbe darti lo stesso mal di testa.

Sia con Opera che con Chrome, c'è una bandiera che insiste sul fatto che il campo è obbligatorio, (nonostante il fatto che ci sia del contenuto). Chrome è abbastanza piacevole per dare questo messaggio di errore nella console:

An invalid form control with name='<name of textarea>' is not focusable. 

Non

troppo sorprendente se si considera che TinyMCE in realtà crea un contenitore div modificabile, nascondendo il vostro originale textarea. E 'questo nascosto textarea (con un attributo required) che il browser si aspetta che tu fornisca un valore per.

corso a Github, qui: https://github.com/tinymce/tinymce/issues/2584, c'è una soluzione suggerita, che va in questo modo:

// fix tinymce bug 
     if($this.is('[required]')){ 
      options.oninit = function(editor){ 
       $this.closest('form').bind('submit, invalid', function(){ 
        editor.save(); 
       }); 
      } 
     } 

non ho ancora testato questo frammento di codice personalmente, ma lo studio potrebbe essere in grado di farti andare, come finché sarai in grado di farlo cadere nel posto giusto.