Проверка jQuery не работает с плагином текстового редактора jQuery (TextArea)

Я работаю с плагином jQuery TE (http://jqueryte.com/). Похоже, он не работает с плагином проверки jQuery.

Обычное текстовое поле работает нормально, но если я хочу преобразовать его в jqte WYSIWYG, я теряю эту функциональность.

В этом примере проверяются поля «Имя» и «Биография», но не поле «Резюме».

jsFiddle

HTML:

<form id="frmExample">
<div><b>Name:</b></div>
<input name="txtName" id="txtName" class="required" />
<br />
<div><b>Bio:</b></div>
<textarea cols="40" rows="6" name="txtBio" id="txtBio" class="required"></textarea>
<br />
<div><b>Resume</b></div>
<textarea name="txtResume" class="required" id="txtResume"></textarea>
<br />
<br />
<input type="submit" value="Save" />

JS:

$("#txtResume").jqte();
$("#frmExample").validate();

jquery-validate jqte
person jasonwarford    schedule 06.06.2014    source источник

Ответы (2)


arrow_upward
1
arrow_downward

Я подробно описал пример этого в сообщении в блоге: http://chadkuehn.com/jquery-te-validation/

Когда вы помещаете jqte в тег TEXTAREA, он скрывает исходный элемент. Таким образом, в плагине проверки вы должны настроить разметку, которая видна при выделении и снятии выделения. Вы также должны внести некоторые коррективы в размещение метки ошибки.

 errorPlacement: function (error, element) {
      var el = $(element).closest(".jqte");
      if (el.length == 1) {
          error.insertAfter(el);
      } else {
          error.insertAfter(element);
      }
  },
  highlight: function (element, errorClass, validClass) {
      $(element).addClass(errorClass).removeClass(validClass);

      var el = $(element).closest(".jqte");
      if (el.length == 1) {
          el.addClass(errorClass);
      }
  },
  unhighlight: function (element, errorClass, validClass) {
      $(element).removeClass(errorClass).addClass(validClass);
      var el = $(element).closest(".jqte");
      if (el.length == 1) {
          el.removeClass(errorClass);
      }
  }

Посмотрите DEMO здесь.

person Chad Kuehn    schedule 06.06.2014

arrow_upward
0
arrow_downward

Используя ASP.NET MVC, я бы порекомендовал это... Для автоматической проверки jQuery с помощью jqte выполните при запуске:

$('.jqte_editor').change(function () {
    if ($(this).parent().siblings('.textarea-editor').hasClass('.input-validation-error'))
        $(this).parent().addClass('input-validation-error');
    else
        $(this).parent().removeClass('input-validation-error');
});

$('form').bind('submit', function () {
    $('.textarea-editor.input-validation-error').parent().parent().addClass('input-validation-error');
    $('.textarea-editor:not(.input-validation-error)').parent().parent().removeClass('input-validation-error');
});

И не забудьте поместить класс textarea-editor в текстовое поле.

person eduardobr    schedule 08.07.2014