This section of the manual documents in detail all the properties and methods of the Editize API for ASP.NET.
To create an Editize field in a Web Form, first ensure that the
EditizeDotNet.dll
has been placed in the bin folder in the root
of the current Web Application (note: Visual Studio .NET will do this for
you automatically). Then load the Editize Server Control:
<%@ Register TagPrefix="SitePoint"
Namespace="EditizeDotNet" Assembly="EditizeDotNet"
%>
You can then create an Editize field using the SitePoint:Editize
tag:
<SitePoint:Editize runat="server"
id="example"></SitePoint:Editize>
The following sections list the various attributes and event handlers that
you can assign to the SitePoint:Editize
tag.
ID
) As shown above, the ID
attribute
uniquely identifies the Editize field in your page, so that you
can access the content that users edit with it.<SitePoint:Editize runat="server" id="MyEditize"
/>
MyEditize
.ID
= "MyEditize";
Width
"600px"
) Specifies the width of the
Editize field. May be specified in pixels or as a percentage of
available width.<SitePoint:Editize runat="server" id="MyEditize"
width="400px"
/>
MyEditize
.Width
= new Unit("600px")
Height
"600px"
) Same as Width
,
but specifies the height of the Editize field.<SitePoint:Editize runat="server" id="MyEditize"
height="400px"
/>
MyEditize
.Height
= new Unit("600px");
Codebase
"."
) A relative or absolute URL. Specifies
the directory where the Editize JAR files and license file(s) may
be found on your site. Editize may not work properly if its files
are stored in a password-protected directory of your Web server (the user
may be prompted, possibly repeatedly, for the username and password to access
the files). By placing them in an unprotected directory and then setting
this property to point to that directory, you can use Editize on
password-protected pages.<SitePoint:Editize runat="server" id="MyEditize"
codebase="/editize/" />
Content
""
) The HTML content in the control.
By setting this value, you can present the user with a document to edit.
By retrieving this value, you can obtain the document that the user created.
When this value has changed following a form submission, the control fires
a ContentChanged
event (see Control Events
below).<SitePoint:Editize runat="server" id="MyEditize"
content="<p>Document here</p>"
/>
MyEditize.Content = "<p>Document here</p>";
The properties in this section are all of type bool
, and may
all be set to either true
or false
to enable or
disable the feature in question.
E.g.: Disabling paragraph styles with a tag attribute:
<SitePoint:Editize runat="server" id="MyEditize"
paragraphstyles="false" />
E.g.: Disabling inline code by setting an object property in C#:
MyEditize
.InlineCode
= false; // Disables inline code
Unless otherwise indicated, these properties default to true
.
About
true
, the pop-up menu in Editize will contain
a "About Editize" menu item, which opens the Editize
Web site in a new browser window when selected. If false
,
the menu item does not appear.EditButtons
true
, the user has access to the standard edit features
(cut, copy, paste, undo, redo) through buttons on the toolbar. If false
,
the buttons do not appear, but the features remain available through the
pop-up menu and keyboard shortcuts.CodeView
false
. If true
, the
user has access to a 'Code View' tab that displays the underlying HTML code
of the document for direct editing.FormElementsAllowed
false
. If true
, the
user may insert form elements (including form, input, select and textarea
tags) by pasting HTML content from the clipboard, or by typing them into
the 'Code View' tab. Otherwise, these tags are stripped out when reading
in HTML content.ParagraphStyles
true
, the user can select paragraph styles from a drop-down
menu in the toolbar.HeadingStyle
true
, the Heading style is available in the paragraph
style dropdown.SubheadingStyle
true
, the Subheading style is available in the paragraph
style dropdown.InsetStyle
true
, the Indent and Outdent buttons will be available
in the toolbar.MonospacedStyle
true
, the Monospaced style is available in the paragraph
style dropdown.ParagraphAlignments
true
, the user can choose to make paragraphs (except for
Monospaced paragraphs) Left, Center, or Right aligned. If false
,
all paragraphs are Left aligned.BulletLists
true
, the user can create bullet lists with a button on
the toolbar.NumberedLists
true
, the user can create numbered lists with a button
on the toolbar.BoldText
true
, the user can create bold text with a button on the
toolbar, or with a keyboard shortcut (Ctrl-B).ItalicText
true
, the user can create italic text with a button on
the toolbar.UnderlineText
true
, the user can create underlined text with a button
on the toolbar, or with a keyboard shortcut (Ctrl-U).HighlightText
true
, the user can create highlighted text (<span
class="highlighted">
) with a button on the toolbar.InlineCode
true
, the user can create inline code (<code>
)
with a button on the toolbar, or with a keyboard shortcut (Alt-C).Hyperlinks
true
, the user can create and remove hyperlinks with a
button on the toolbar. The user may choose whether a link loads in the default
window, or in a new window (<a href="..." target="_blank">
).Images
true
, the user can create and edit images with a button
on the toolbar. The user may provide an absolute or relative URL to the
image file to be inserted. Relative URLs are resolved based on the BaseURL
property, described below.Tables
true
, the user can create tables with a button on the
toolbar.These properties let you configure Editize to display a document with the same character styles that you use on your site. In this way, the WYSIWYG editing interface presented by Editize can be made to exactly match the look the content will have when displayed as part of your site.
AppletBgColor
CodeView
feature is enabled, this property controls the color of the area surrounding
the WYSIWYG and Code View tabs. When the ShowSubmitButton
feature is enabled, this property controls the color of the area surrounding
the Java submit button. This does not affect the background color of the
document displayed in the applet (see BGColor
below for that); only of the applet itself. The value is specified as an
HTML color code ("#RRGGBB"
), or as an HTML
standard color name.BaseURL
http://www.mysite.com/site/content.asp
,
you should set the base URL to http://www.mysite.com/site/
.
By so doing, you can tell Editize to insert an image with the URL graphics/mylogo.gif
and it will find the image file at http://www.mysite.com/site/graphics/mylogo.gif
.BGColor
white
) Specifies the background color that should
be displayed within the text entry area of the Editize applet.
The value is specified as an HTML color code ("#RRGGBB"
),
or as an HTML standard
color name.BaseFontFace
"Times New Roman"
) Specifies the font
face for Normal text in the Editize form field. All other character
and paragraph styles except Monospaced and Inline Code will inherit this
font face by default as well. You may specify a single font family (e.g.
"Verdana"
), or one of the following logical font
names: "Dialog"
, "DialogInput"
,
"Monospaced"
, "Serif"
, "SansSerif"
,
or "Symbol"
. BaseFontSize
16
) Specifies the font size for Normal text in
the Editize form field. All other character and paragraph styles
except Heading and Subheading will inherit this font size by default as
well. The value is specified as an integer (int
) in pixels. BaseFontColor
"#000000"
) Specifies the font color for
Normal text in the Editize form field. All other character and
paragraph styles except hyperlinks will inherit this font color by default
as well. The value is specified as an HTML color code ("#RRGGBB"
),
or as an HTML standard
color name. HeadFontFace
BaseFontFace
for details. HeadFontSize
BaseFontSize
for
details.HeadFontColor
BaseFontColor
for details. SubheadFontFace
BaseFontFace
for details.SubheadFontSize
BaseFontSize
for details.SubheadFontColor
BaseFontColor
for details.InsetFontFace
BaseFontFace
for details.InsetFontSize
BaseFontSize
for details. InsetFontColor
BaseFontColor
for details.MonospacedBackgroundColor
"#RRGGBB"
),
or as an HTML standard
color name.HighlightColor
"#FF0000"
) For the highlighted text feature
to work, you must specify a font color for highlighted text with this property.
The value is specified as an HTML color code ("#RRGGBB"
),
or as an HTML standard
color name.LinkColor
"#0000FF"
) Specifies the text color for
hyperlinked text in the Editize form field. The value is specified
as an HTML color code ("#RRGGBB"
), or as an HTML
standard color name.LinkUrls
string
that contains a comma-separated list of URLs.<SitePoint:Editize runat="server" id="MyEditize" linkurls="mailto:,http://www.sitepoint.com/article.php" />E.g. As an object property in C#:
// Provide two suggested link URLs for users
MyEditize.LinkUrls="mailto:,http://www.sitepoint.com/article.php";
url1 Description of the first image url2 Description of the second image url3 Description of the third image ...Each line should contain a URL optionally followed by a description of the image. The description (if specified) will both appear in the image list and be used as the default value for the
alt
attribute if the
image is selected. If no description is provided, the URL of the image will
appear in the list instead.LicenseFileExt
"lic"
).lic
extension from being downloaded. If you encounter this issue, you can simply
rename your Editize license file to, say editize.myhost.com.key
and set this property to "key"
so that Editize
can find it.The Editize ASP.NET Server Control supports a single event (of type
EventHandler
), which is triggered each time the content in the
control has been changed following a form submission.
ContentChanged
Content
property appropriately. Whenever this occurs, a ContentChanged
event is raised by the Control. You can set your own method to handle this
event to react to changes the user makes to the content. Detailed examples
of this are provided in the sample ASP.NET pages provided with this distribution
(in the /aspdotnet/samples
directory).<SitePoint:Editize runat="server" id="MyEditize" onContentChanged="MyEditize_ContentChanged" />Example: As code in C#:
<script language="C#" runat="server">
public void MyEditize_ContentChanged(object sender, EventArgs e)
{ // React to the event... }
</script>
<script language="C#" runat="server">
private void Page_Load(object sender, EventArgs.e) { MyEditize.ContentChanged += new EventHandler(MyEditize_ContentChanged);
} public void MyEditize_ContentChanged(object sender, EventArgs e) { // React to the event... } </script>