72 lines
1.9 KiB
HTML
72 lines
1.9 KiB
HTML
|
<!doctype html>
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<meta charset="utf-8">
|
||
|
|
<title>jQuery Validation plugin: integration with TinyMCE</title>
|
||
|
|
<script src="../../lib/jquery.js"></script>
|
||
|
|
<script src="../../dist/jquery.validate.js"></script>
|
||
|
|
<script src="//tinymce.cachefly.net/4.1/tinymce.min.js"></script>
|
||
|
|
<script>
|
||
|
|
tinymce.init({
|
||
|
|
mode: "textareas",
|
||
|
|
|
||
|
|
setup: function(editor) {
|
||
|
|
editor.on('change', function(e) {
|
||
|
|
tinymce.triggerSave();
|
||
|
|
$("#" + editor.id).valid();
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
});
|
||
|
|
$(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
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
})
|
||
|
|
</script>
|
||
|
|
<!-- /TinyMCE -->
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<form id="myform" action="">
|
||
|
|
<h3>TinyMCE4 and Validation Plugin integration example</h3>
|
||
|
|
<label>Some other field</label>
|
||
|
|
<input name="title">
|
||
|
|
<br>
|
||
|
|
<label>Some richt text</label>
|
||
|
|
<textarea id="content" name="content" rows="15" cols="80" style="width: 80%"></textarea>
|
||
|
|
<br>
|
||
|
|
<input type="submit" name="save" value="Submit">
|
||
|
|
</form>
|
||
|
|
</body>
|
||
|
|
</html>
|