2013-05-16 1 views
3

Я использую редактор Bootstrap wysiwyg5 в качестве части формы.Проверка в редакторе Bootstrap wysiwyg5

Эта область текста является обязательным полем (не должно быть пустым). Я хочу проверить, ввел ли пользователь какое-либо значение в это поле или нет. Я вижу, что Bootstrap wysiwyg использует iframe для отображения содержимого. Я попытался получить доступ к содержимому тела iframe в jQuery, выполнив следующие действия:

$('.textarea.wysihtml5-editor').html() 

но не удалось.

Мой вопрос: Как проверить, ввел ли пользователь какой-либо текст в этом Bootstrap wysiwyg textarea. Пожалуйста, помогите мне.

PS: Я видел this вопрос, но это было не очень полезно.

ответ

11

Я знаю, вопрос старый, но, возможно, помочь кому-то ищет это ..

Чтобы сделать JQuery Validation работать с WysiHtml5, просто установить плагин не игнорировать скрытые: текстовых областей

$('#form').validate({ 
    ignore: ":hidden:not(textarea)",  
    rules: {  
     WysiHtmlField: "required" 
    }, 
    submitHandler: function(form) { ... } 
}); 
+0

Вы правы! Я должен был понять это непросто! :) – codeMan

+0

Спасибо, это отлично сработало для меня. – user752746

+0

Сэкономил много времени! большое спасибо –

2

необходимо прослушать событие размытия, затем проверить редактор.textareaElement редактора, чтобы получить базовую текстовую область.

var editor = new wysihtml5.Editor("wysihtml5-editor"); 

editor.on('blur', function() { 
    if(this.textareaElement.value.length === 0) { alert('no blank entries!'); } 
}); 

Большая часть этой информации на их вики: https://github.com/xing/wysihtml5/wiki

+0

утра извините, это не работает! первая строка не работает: 'var editor = new wysihtml5.Editor (" wysihtml5-editor ");' 'не работает! где '$ (". textarea "). wysihtml5();' -works – codeMan

+0

чувак, ядро ​​образца - это то, что вам нужно. Я включил вышеприведенную строку, чтобы показать вам, что вам нужно собрать объект редактора. o_O – rlemon

1

вы используете самозагрузки-wysihtml5 и rlemon ответил вам код для регулярного, не бутстраповской тематикой WYSIHTML5.

ваш

вар редактор = новый wysihtml5.Editor ("wysihtml5-редактор");

код на самом деле внутри самозагрузки-wysihtml5-0.0.2.js (или какой-либо версии, который вы использовали)

однако эта обертка определяет объект редактора как window.editor, так что вы можете создать свою функцию размытия, как это , после того, как вы инициируете элемент wysihtml5.

window.editor.on('blur', function() { 
// do whatever you want to do on blur 
}); 
1

Я думаю, что нашел решение, по jquery мы добавляем класс nicehide к нашему wysihtml5, теперь мы можем его проверить, я скрываю его с видимостью скрытым, возможно, код ur может без него, другое решение может быть поставлено iframe class и nicehide к тому же положению ...

jQuery('.wysihtml5').wysihtml5({ 
"events":  { 
"load": function() { 
jQuery('.wysihtml5').addClass('nicehide'); 
} 
} 
}); 


.nicehide { 
resize: none; 
display: block !important; 
width: 0; 
height: 0; 
margin: -200px 0 0 0; 
float: left; 
visibility:hidden; 
} 

Благодаря https://github.com/jhollingworth/bootstrap-wysihtml5/issues/275, я только добавил видимость ..

0

html5 проверки (требуется = "требуется", например) не работают. Это происходит потому, что исходное поле скрыто.

В случае для проверки в начальной загрузки редактора wysiwyg5 на основе вашего вопроса, попробуйте следующее:

jQuery('.wysihtml5').wysihtml5({ 
    "events":  { 
     "load": function() { 
      jQuery('.wysihtml5').addClass('nicehide'); 
     } 
    } 
}); 

и это для CSS:

.nicehide { 
    resize: none; 
    display: block !important; 
    width: 0; 
    height: 0; 
    margin: 0 0 0 -15px; 
    float: left; 
    border: none; 
} 

Надежда, что помогает вам :)