提交 | 用户 | 时间
|
58d006
|
1 |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> |
A |
2 |
<html xmlns="http://www.w3.org/1999/xhtml"> |
|
3 |
<head> |
|
4 |
<title>jQuery Validation plugin: integration with TinyMCE</title> |
|
5 |
|
|
6 |
<script type="text/javascript" src="../../lib/jquery.js"></script> |
|
7 |
<script type="text/javascript" src="../../jquery.validate.js"></script> |
|
8 |
<script type="text/javascript" src="tiny_mce.js"></script> |
|
9 |
<script type="text/javascript"> |
|
10 |
tinyMCE.init({ |
|
11 |
mode : "textareas", |
|
12 |
theme : "simple", |
|
13 |
// update validation status on change |
|
14 |
onchange_callback: function(editor) { |
|
15 |
tinyMCE.triggerSave(); |
|
16 |
$("#" + editor.id).valid(); |
|
17 |
} |
|
18 |
}); |
|
19 |
$(function() { |
|
20 |
var validator = $("#myform").submit(function() { |
|
21 |
// update underlying textarea before submit validation |
|
22 |
tinyMCE.triggerSave(); |
|
23 |
}).validate({ |
|
24 |
ignore: "", |
|
25 |
rules: { |
|
26 |
title: "required", |
|
27 |
content: "required" |
|
28 |
}, |
|
29 |
errorPlacement: function(label, element) { |
|
30 |
// position error label after generated textarea |
|
31 |
if (element.is("textarea")) { |
|
32 |
label.insertAfter(element.next()); |
|
33 |
} else { |
|
34 |
label.insertAfter(element) |
|
35 |
} |
|
36 |
} |
|
37 |
}); |
|
38 |
validator.focusInvalid = function() { |
|
39 |
// put focus on tinymce on submit validation |
|
40 |
if( this.settings.focusInvalid ) { |
|
41 |
try { |
|
42 |
var toFocus = $(this.findLastActive() || this.errorList.length && this.errorList[0].element || []); |
|
43 |
if (toFocus.is("textarea")) { |
|
44 |
tinyMCE.get(toFocus.attr("id")).focus(); |
|
45 |
} else { |
|
46 |
toFocus.filter(":visible").focus(); |
|
47 |
} |
|
48 |
} catch(e) { |
|
49 |
// ignore IE throwing errors when focusing hidden elements |
|
50 |
} |
|
51 |
} |
|
52 |
} |
|
53 |
}) |
|
54 |
</script> |
|
55 |
<!-- /TinyMCE --> |
|
56 |
|
|
57 |
</head> |
|
58 |
<body> |
|
59 |
|
|
60 |
<form id="myform" action=""> |
|
61 |
<h3>TinyMCE and Validation Plugin integration example</h3> |
|
62 |
|
|
63 |
<label>Some other field</label> |
|
64 |
<input name="title" /> |
|
65 |
|
|
66 |
<br/> |
|
67 |
|
|
68 |
<label>Some richt text</label> |
|
69 |
<textarea id="content" name="content" rows="15" cols="80" style="width: 80%"></textarea> |
|
70 |
|
|
71 |
<br /> |
|
72 |
<input type="submit" name="save" value="Submit" /> |
|
73 |
</form> |
|
74 |
|
|
75 |
</body> |
|
76 |
</html> |