jQuery Подтвердить с помощью ошибки Summernote Editor: невозможно прочитать свойство «replace» undefined

Question

Я использую MVC5 для создания формы с редактором summernote.

код Razor:

<div class="form-group"> 
     @Html.LabelFor(model => model.Content, htmlAttributes: new { @class = "control-label" }) 
     @Html.EditorFor(model => model.Content, new { htmlAttributes = new { @class = "form-control post-content"} }) 
     @Html.ValidationMessageFor(model => model.Content, "", new { @class = "text-danger" }) 
</div> 

JS:

$('#blog-form .post-content').summernote({ 
    height: 400,     
    minHeight: 300,    
    codemirror: { 
    theme: 'default' 
    } 
}); 

С выше настройки управления редактор делает хорошо. Однако, как только я отойти от редактора, т.е. ONBLUR, я получаю следующее сообщение об ошибке в консоли:

Uncaught TypeError: Cannot read property 'replace' of undefined 
    at $.validator.escapeCssMeta (jquery.validate.js:1014) 
    at $.validator.errorsFor (jquery.validate.js:995) 
    at $.validator.prepareElement (jquery.validate.js:679) 
    at $.validator.element (jquery.validate.js:466) 
    at $.validator.onfocusout (jquery.validate.js:289) 
    at HTMLDivElement.delegate (jquery.validate.js:411) 
    at HTMLFormElement.dispatch (jquery-2.2.3.js:4737) 
    at HTMLFormElement.elemData.handle (jquery-2.2.3.js:4549) 
    at Object.trigger (jquery-2.2.3.js:7819) 
    at Object.simulate (jquery-2.2.3.js:7890) 

Вот тонированная часть DOM:

<div class="form-group"> 
     <label class="control-label" for="Content">Content</label> 
     <textarea class="form-control post-content text-box multi-line" id="Content" name="Content" style="display: none;"></textarea> 

     <div class="note-editor note-frame panel panel-default">  
      ...summernote generated... 
     </div> 

     <span class="field-validation-valid text-danger" data-valmsg-for="Content" data-valmsg-replace="true"></span> 
    </div> 

JQuery версия: 2.2.3

JQuery Validate версия: 1.16.0

Microsoft.jQuery.Unobtrusive.Validation версия: 3.2.3

Я провел некоторое исследование и уже знаю, что это не связано с плагином summernote. Я попытался запустить следующий код внутри и снаружи документа, но он не сработал:

$.validator.setDefaults({ 
      ignore: ":hidden:not(.post-content)" 
}); 

Любые идеи?

Answer 1

Я использую этот скрипт, чтобы заставить валидатор игнорировать элементы Summernote. Он может быть изменен, чтобы игнорировать элементы, созданные другими редакторами HTML.

$('form').each(function() { 
    if ($(this).data('validator')) 
     $(this).data('validator').settings.ignore = ".note-editor *"; 
}); 

Answer 2

Вы можете устранить вышеуказанную ошибку, немного изменив свой код.

var v = $('#myForm').validate({ 
     // exclude it from validation 
     ignore: ":hidden:not(#summernote),.note-editable.panel-body" 
    }); 

    var myElement = $('#summernote'); 

    myElement.summernote({ 
     // See: http://summernote.org/deep-dive/ 
     callbacks: { 
     onChange: function(contents, $editable) { 
      // Note that at this point, the value of the `textarea` is not the same as the one 
     // you entered into the summernote editor, so you have to set it yourself to make 
     // the validation consistent and in sync with the value. 
     myElement.val(myElement.summernote('isEmpty') ? "" : contents); 

     // You should re-validate your element after change, because the plugin will have 
     // no way to know that the value of your `textarea` has been changed if the change 
     // was done programmatically. 
     v.element(myElement); 
    } 
    } 
}); 

Источник (Official): https://github.com/jquery-validation/jquery-validation/issues/1875#issuecomment-272667183