<%@ Register Assembly="Obout.Ajax.UI" Namespace="Obout.Ajax.UI.HTMLEditor" TagPrefix="obout" %>
<obout:Editor runat="server" Id="editor" Width="100%">
<EditPanel Height="360px" OnClientLoaded="editPanelLoaded" ImmediateValidation="false" />
<BottomToolBar ShowHtmlTextButton="false" />
</obout:Editor>
<asp:CustomValidator id="CustomValidator1"
ControlToValidate="editor" ClientValidationFunction="ClientValidate"
Display="None" runat="server"/>
...
<script type="text/javascript">
// on EditPanel loaded
function editPanelLoaded(sender, args) {
// by default the initial mode is 'Design'
var designPanel = sender.get_activePanel();
// get the 'Editor' component
var editor = sender.get_owner();
// get the top toolbar
var topToolbar = editor.get_topToolbar();
// get all buttons of the top toolbar
var buttons = topToolbar.get_buttons();
// try to find the 'SpellCheck' button
for (
var i = 0; i < buttons.length; i++) {
var button = buttons[i];
if (button.get_buttonName() ==
"SpellCheck") {
// get the PopupHolder used for the spell checker popup
var popupHolder = button.get_popupHolder();
// add event handler to the PopupHolder component
popupHolder.add_popupStateChanged(
function (sender, args) {
// some popup closed
if (args.get_state() == Obout.Ajax.UI.HTMLEditor.PopupStateType.Close) {
// 'Spell checker' popup
if (args.get_name().split(
",")[0] ==
"Obout.Ajax.UI.HTMLEditor.Popups.SpellCheckPopup") {
setTimeout(
function () {
// set our 'Spell checked' indicator
designPanel.__contentChecked =
true;
}, 100);
}
}
});
// set our 'Spell checked' indicator
// we suppose that initial content is correct
designPanel.__contentChecked =
true;
// intercept 'content changed' event
designPanel.add_contentChanged(
function (sender, args) {
// reset our 'Spell checked' indicator
sender.__contentChecked =
false;
});
break;
}
}
}
// for custom validator
function ClientValidate(source, arguments) {
// get the Editor component
var editor = $find(
"<%= editor.ClientID %>");
var designMode = Obout.Ajax.UI.HTMLEditor.ActiveModeType.Design;
// get the DesignPanel component
var designPanel = editor.get_editPanel().get_modePanels()[designMode];
// check our 'Spell checked' indicator
if (designPanel.__contentChecked) {
arguments.IsValid =
true;
}
else {
arguments.IsValid =
false;
setTimeout(
function () {
alert(
"Call 'Spell checker' before!");
}, 0);
}
}
</script>