OK, the code snippets route is not going to cut it according to our design team since we want to replicate the exact layout of the cute editor we have before using the drop down list box to populate the variables. I got it working pretty much with at the asp.net dropdownlist server control. However, the variable does not insert when it is placed in the toolbox under Internet Explorer 9, (it works under Latest Chrome and Firefox).
I adopted the code from the custom_buttons3.aspx page and it is as below so you guys can just copy it into an aspx page to see what I am talking about.
When the control is in div outside, everything works fine.
When the control is in div_custom that is moved into the toolbox, it does not insert the text only under IE 9.
I even did a basic HTML drop down using the <select> tags and it exhibits the same behavior.
--------------------------------ASPX page code Begins---------------------------------
<%@ Page Language="c#" %>
<%@ Register TagPrefix="RTE" Namespace="RTE" Assembly="RichTextEditor" %>
<script runat="server">
protected override void OnInit(EventArgs e)
{
base.OnInit(e);
Editor1.ToolbarItems = "{bold,italic,underlinemenu}/{mypanel1}";
}
private void btn_sumbit_click(object sender, EventArgs e)
{
if (sender is Button)
{
Button link = (Button)sender;
Editor1.Text += "<hr />" + link.Text + " clicked";
}
}
</script>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>RichTextEditor - Custom buttons</title>
<link rel="stylesheet" href="../example.css" type="text/css" />
<style>
.serverbtn
{
height:20px;
}
</style>
<script type="text/javascript">
var loader;
var editor;
function RichTextEditor_OnCoreLoad(rteloader) {
loader = rteloader;
var config = loader._config;
var toolbar = config._toolbartemplate || config.toolbar;
var panel1 = "item_" + toolbar + "_" + config.skin + "_" + config.color + "_mypanel1";
var define1 = jsml.class_define(panel1, "htmlcontrol");
define1.constructor(function () {
this["htmlcontrol_constructor"]();
this.set_dock("left");
var custdiv = document.getElementById("div_custom");
this._content.appendChild(custdiv);
custdiv.style.display="";
});
}
function RichTextEditor_OnLoad(rteeditor) {
editor = rteeditor;
}
//This function takes the dropdownlist control selected item and add it to the text
function insertTextFromDDL(ddl)
{
if (editor) {
if (ddl) {
var emailvariabletext = ddl.options[ddl.selectedIndex].text;
editor.InsertText(emailvariabletext, false);
//Reset it to the first item in the drop down list
//ddl.selectedIndex = 0;
}
}
}
</script>
</head>
<body>
<form id="Form1" method="post" runat="server">
<h1>
Adding custom buttons (server)</h1>
<p>
The Rich Text Editor allows you extend the functions of the editor. You can create
new custom buttons and add them to the editor's toolbar list.
</p>
<div id="div_custom" style="display: none;">
<select id="select_emailvariables" onchange="insertTextFromDDL(this);">
<option value="">Select Variable</option>
<option value="value1">Variable1</option>
<option value="value2">Variable2</option>
</select>
<asp:DropDownList ID="ddlCustom" runat="server" onchange="insertTextFromDDL(this);">
<asp:ListItem Text="Select One" Value=""></asp:ListItem>
<asp:ListItem Text="Variable1" Value=""></asp:ListItem>
<asp:ListItem Text="Variable2" Value=""></asp:ListItem>
</asp:DropDownList>
</div>
<div id="div1">
<select id="select1" onchange="insertTextFromDDL(this);">
<option value="">Select Variable</option>
<option value="value1">Variable1</option>
<option value="value2">Variable2</option>
</select>
<asp:DropDownList ID="DropDownList1" runat="server" onchange="insertTextFromDDL(this);">
<asp:ListItem Text="Select One" Value=""></asp:ListItem>
<asp:ListItem Text="Variable1" Value=""></asp:ListItem>
<asp:ListItem Text="Variable2" Value=""></asp:ListItem>
</asp:DropDownList>
</div>
<p>
<RTE:Editor runat="server" ID="Editor1" />
</p>
</form>
</body>
</html>
--------------------------------ASPX page code Ends---------------------------------