4

I have been running jquery validation and summernote side by side for a while now successfully.

it was working and now I am getting an error on form.valid(). The note field doesn't need to be validated.

I have stripped my code down to the bare minimum, and whittled down the Ignore settings - if I remove the ignore settings it works, if I have ignore settings, it breaks, with a "validator is undefined" error

I have set up a fiddle so you can see it working and not working, it's currently set not to work

http://jsfiddle.net/JGuymer/83q0r21s/22/

<form id="form">   
<textarea id="textarea"></textarea>
<a id="clickme" href="#">click Me</a>
</form>

JQuery:

$(document).ready(function() {
    $("#textarea").summernote();
    //uncomment to work
    //$('#form').validate();       
    //uncomment to fail
    $('#form').validate({ignore:[]})     
    $("#clickme").click(function(){      
        validate();         
        return false;
    })
});

function validate() {
 if ($('#form').valid()) {
 alert('valid');
 }
}

Any ideas would be appreciated

Thanks James

4

3 に答える 3

3

同様の問題があります。

まず、jquery.validate検証したいものを除いて、隠しフィールドを無視するように設定できます (IIRC、summernote にはかなりの数があります)。

$.validator.setDefaults({ ignore: ":hidden:not(.class-of-hidden-field-i-want-to-validate-1, class-of-hidden-field-i-want-to-validate-2, class-of-hidden-field-i-want-to-validate-3...) }); 

それは私のためにそれを修正しました。

また、リンクを追加するためのモーダル ダイアログ (summernote v0.5.10) を操作するたびに、

Uncaught TypeError: Cannot read property 'settings' of `undefined`

オンjquery.validate.js:360

私ができることを見ると、summernote.js彼らは次のことができます:

var tplDialog = function (className, title, body, footer) {
        return '<div class="' + className + ' modal" aria-hidden="false">' +
                 '<div class="modal-dialog">' +
                   '<div class="modal-content">' +
                     (title ?
                     '<div class="modal-header">' +
                       '<button type="button" class="close" aria-hidden="true" tabindex="-1">&times;</button>' +
                       '<h4 class="modal-title">' + title + '</h4>' +
                     '</div>' : ''
                     ) +
                     '<form class="note-modal-form">' + // ERROR CAUSE
                       '<div class="modal-body">' +
                         '<div class="row-fluid">' + body + '</div>' +
                       '</div>' +
                       (footer ?
                       '<div class="modal-footer">' + footer + '</div>' : ''
                       ) +
                     '</form>' + // ERROR CAUSE
                   '</div>' +
                 '</div>' +
               '</div>';
    };

私の(一時的な)修正は、でマークした行で に置き換えformています。おそらく私は何かが欠けているかもしれませんが、とにかくそれを形にする意味がわかりません。div// ERROR CAUSE

このコードを変更することはお勧めしません (新しいバージョンに更新して変更を失う可能性があります...) が、問題が解決するまではこれで十分です。

于 2014-11-07T13:30:18.853 に答える