2

Estou fazendo um validate para ser usado em conjunto com o tinyMCE. No site do Validate do Jquery, tem um exemplo para fazer isso. Lá funciona. No meu site está aparecendo a mensagem "Uncaught TypeError: Cannot set property 'focusInvalid' of undefined". Já mexi em tudo e não consegui entender o que acontece.

Segue o que fiz até o momento.

   tinymce.init({
    selector: "textarea",
    fontsize_formats: "8pt 9pt 10pt 11pt 12pt 14pt 16pt 18pt 20pt 22pt 24pt 26pt 28pt 36pt 48pt 72pt",
    theme: "modern",
    height: 200,
    resize: false,
    language: "pt_BR",
    removed_menuitems: 'newdocument',
    forced_root_block : "", 
    force_br_newlines : true,
    force_p_newlines : false,           
    plugins: [
    "advlist autolink lists link image charmap preview hr anchor pagebreak",
    "searchreplace wordcount visualblocks visualchars code fullscreen",
    "insertdatetime media nonbreaking save table contextmenu directionality",
    "template paste textcolor colorpicker textpattern"
    ],
    toolbar1: "insertfile undo redo | styleselect | fontsizeselect  | bold italic | alignleft aligncenter alignright alignjustify",
    toolbar2: "bullist numlist outdent indent | link image | print preview media | forecolor backcolor emoticons",
    templates: [
    {title: 'Test template 1', content: 'Test 1'},
    {title: 'Test template 2', content: 'Test 2'}
    ]
    }); 
    $(function() {
    var validator = $("#myform").submit(function() {
                // update underlying textarea before submit validation
    tinyMCE.triggerSave();
    }).validate({
    ignore: "",
                rules: {
                    title: "required",
                    content: "required"
    },
    errorPlacement: function(label, element) {
                    // position error label after generated textarea
                    if (element.is("textarea")) {
                        label.insertAfter(element.next());
                    } else {
                        label.insertAfter(element)
                    }
                }
            });
    validator.focusInvalid = function() {
                // put focus on tinymce on submit validation
                if (this.settings.focusInvalid) {
                    try {
                        var toFocus = $(this.findLastActive() || this.errorList.length && this.errorList[0].element || []);
                        if (toFocus.is("textarea")) {
                            tinyMCE.get(toFocus.attr("id")).focus();
                        } else {
                            toFocus.filter(":visible").focus();
                        }
                    } catch (e) {
                        // ignore IE throwing errors when focusing hidden elements
                    }
                }
            }
        })

É nessa linha "validator.focusInvalid = function() {" que dá o erro.

2
  • 1
    Você precisa carregar o script do validate antes de rodar este seu código. O erro está acontecendo porque o validator é uma variável indefinida no momento em que você está executando este código. Commented 22/12/2017 às 15:48
  • Veja que há uma diferença tinymce.init e tinyMCE.
    – Sam
    Commented 22/12/2017 às 16:55

1 Resposta 1

1

Primeiro, observe que você iniciou o plugin com letras minúsculas, o que já ocasionaria erro e o plugin nem seria iniciado:

tinymce.init({ em vez de tinyMCE.init({

Mas o erro citado está relacionado à id do form que você quer validar, na linha abaixo:

var validator = $("#myform").submit(function() {

Isso quer dizer que o form deve ter o mesmo id instanciado pelo Validator:

<form id="myform" action="">

Qualquer coisa diferente disso, o Validator não achará o form e tentará puxar propriedades de um elemento não encontrado, ocasionando o erro Uncaught TypeError: Cannot set property 'focusInvalid' of undefined, em:

this.settings.focusInvalid

O this é cada elemento que será validado no form. Portanto, se o elemento não existe, resultará no erro citado.

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .