OBOUT - ASP.NET HTML Editor - Client side - Custom Popup Window support

ASP.NET HTML Editor - Custom Popup Window support

User can create his own "HTML Editor style" popup windows. You should use client-side HTML Editor object's method customPopup:

editorObject.customPopup(cssStyle, popupName, innerSRC, postbackFunc, initFunc, defaultFolder, isEdit);

Parameters:

Name	Description
cssStyle	Name of CSS class used for this popup, it should be defined in style.css file in /Editor/ed_styles folder. Example: .popup_fieldset { width: 300px; height:115px; } Parameter should be set "popup_fieldset".
popupName	Name of popup window, it should be defined in localization files (en.xml, es.xml ...) in /Editor/ed_localization folder. Example for en.xml file: <popup name="fieldset" create-title="Insert Fieldset" edit-title="Edit Fieldset"> <field name="width" value="Width" /> <field name="height" value="Height" /> <field name="padding" value="Padding" /> <field name="margin" value="Margin" /> <field name="ok" value="OK" /> <field name="cancel" value="Cancel" /> </popup> Parameter should be set "fieldset".
innerSRC	Name of .HTML or .ASPX file that will be used for inner iframe of this popup. Example: "__fieldset.aspx"
postbackFunc	Name of JavaScript function called when Cancel or OK button of this popup was clicked. It is used for validation and executing some actions. This function has two parameters: doc - document element of popup's inner iframe. popup_iframe - main iframe element of popup. When OK clicked, if the function returns true - popup will be closed, otherwise popup will not be closed. Example: var element = ...; // created/editing element var editor = ...; // Editor's client-side object function postback(doc, popup_iframe) //on OK and Cancel buttons click { if(doc != null) // OK clicked { // get fields values from popup var width = doc.getElementById("widthField" ).value; ... // check input fields and highlight them on error if((isNaN(width) && width.length > 0) \|\| width < 0) { alert("Not correct Width"); doc.getElementById("widthField").focus(); return false; // don't close popup } ... // update properties of the element element.style.width = (!isNaN(width) && width.length > 0)?(width+"px"):""; ... } else // Cancel Clicked { // restore saved Editor's content (after success InsertHtml) editor.RestoreContent(); } return true; // close popup }
initFunc	Name of JavaScript function called when popup's inner iframe is loaded (with innerSRC). It is used for popup's inner content initialization. This function has two parameters: doc - document element of popup's inner iframe. popup_iframe - main iframe element of popup. Example: var element = ...; // created/editing element var editor = ...; // Editor's client-side object function init(doc,popup_iframe) // on Popup window content init { if(doc != null) { // init popup's fields doc.getElementById("widthField").value = (element.style.width)?parseInt(element.style.width):""; ... } }
defaultFolder	Default scripts folder indicator: true - default scripts folder (/Editor/ed_scripts) is used for innerSRC. false - root folder is used for innerSRC.
isEdit	Popup title indicator: true - edit-title field of popup xml element is used for popup's title. false - create-title field of popup xml element is used for popup's title. Look at popupName use example above.

See Custom_popup.aspx and Custom_ImageUpload_popup.aspx examples in downloaded zip file.

"Boys… You are the best ones."

Alvaro Torres Tatis

Random testimonial All testimonials

obout.com

HTML Editor Home

HTML Editor Home

Examples - 80

Appearance - 10

Content - 16

Spell Checker - 3

Localization - 2

Integration - 9

ASP.NET AJAX ControlToolkit - 5

Server-Side API - 13

Server-Side Events - 5

Client-Side API - 10

Customize - 17

Knowledge Base - 1

Documentation - 23

Server side

HTML Editor properties & events

HTML Editor inner properties

Custom font sizes

Custom Context Menu

Dictionaries for spell checker

Hot keys definition

Disabling Context Menu items

Additional CSS files New

New

Client side

Main functions and interfaces

Custom Context Menu support

Custom Popup Window support

Top toolbar buttons' methods

State functions

Suppress Context Menu

Spelling dictionary

Dictionary structure

Generate phonetic code

How to add new word

Supported browsers

Tutorials - 6