Yahoo Rich Text Editor with Asp.net not working - asp.net

Question

I have tried to make yahoo rich text editor in my ascx user control but i failed even after taking help from yahoo developers society.
here what i did with it yet.
1) I created ascx user control and paste the text area html code
<div class="yuieditor">
<form method="post" action="#" id="form1">
<textarea id="myEditor" name="editor" rows="20" cols="75">
</textarea>
</form>
</div>
2) I initialized yahoo css and javascript from yahoo for my rich text editor.
<!-- Skin CSS file -->
<link rel="stylesheet" type="text/css"
href="http://yui.yahooapis.com/2.7.0/build/assets/skins/sam/skin.css"/>
<!-- Utility Dependencies -->
<script type="text/javascript"
src="http://yui.yahooapis.com/2.7.0/build/yahoo-dom-event/yahoo-dom-event.js"></script>
<script type="text/javascript"
src="http://yui.yahooapis.com/2.7.0/build/element/element-min.js"></script>
<!-- Needed for Menus, Buttons and Overlays used in the Toolbar -->
<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/container/container_core-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/menu/menu-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/button/button-min.js"></script>
<!-- Source file for Rich Text Editor-->
<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/editor/editor-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/connection/connection-min.js"></script>
<script type="text/javascript" src="/wp-content/uploads/2007/10/yui-image-uploader26.js"></script>
<script type="text/javascript">
var myEditor = new YAHOO.widget.Editor('example_editor', {
height: '300px',
width: '522px',
dompath: true,
animate: true
});
yuiImgUploader(myEditor, 'example_editor',
'/wp-content/uploads/2007/12/yui_img_uploader.php', 'image');
myEditor.render();
</script>
but its not working fine :( i am depressed to work with it but i dont want to use any other editor, i only want to use this.
please help.
here is my full code on my ascx.
<%# Control Language="C#" AutoEventWireup="true" CodeBehind="yui.ascx.cs" Inherits="YUI.yui" %>
<!-- Skin CSS file -->
<link rel="stylesheet" type="text/css"
href="http://yui.yahooapis.com/2.7.0/build/assets/skins/sam/skin.css"/>
<!-- Utility Dependencies -->
<script type="text/javascript"
src="http://yui.yahooapis.com/2.7.0/build/yahoo-dom-event/yahoo-dom-event.js"></script>
<script type="text/javascript"
src="http://yui.yahooapis.com/2.7.0/build/element/element-min.js"></script>
<!-- Needed for Menus, Buttons and Overlays used in the Toolbar -->
<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/container/container_core-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/menu/menu-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/button/button-min.js"></script>
<!-- Source file for Rich Text Editor-->
<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/editor/editor-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/connection/connection-min.js"></script>
<script type="text/javascript" src="/wp-content/uploads/2007/10/yui-image-uploader26.js"></script>
<script type="text/javascript">
var myEditor = new YAHOO.widget.Editor('example_editor', {
height: '300px',
width: '522px',
dompath: true,
animate: true
});
yuiImgUploader(myEditor, 'example_editor',
'/wp-content/uploads/2007/12/yui_img_uploader.php', 'image');
myEditor.render();
</script>
<div class="yuieditor">
<form method="post" action="#" id="form1">
<textarea id="myEditor" name="editor" rows="20" cols="75">
</textarea>
</form>
</div>
please help me out why this is not working.

Answer 1

You are not using correct control id in your code, Try this:
Change
new YAHOO.widget.Editor('example_editor',
to
new YAHOO.widget.Editor('myEditor',
Update your code to use correct id - myEditor in place of example_editor in other part of your code
Also change your code to use yui-skin-sam class and not yuieditor
Ex:
<div class="yui-skin-sam">
Working code:
<!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>
<!-- Skin CSS file -->
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.9.0/build/assets/skins/sam/skin.css">
<!-- Utility Dependencies -->
<script src="http://yui.yahooapis.com/2.9.0/build/yahoo-dom-event/yahoo-dom-event.js"></script>
<script src="http://yui.yahooapis.com/2.9.0/build/element/element-min.js"></script>
<!-- Needed for Menus, Buttons and Overlays used in the Toolbar -->
<script src="http://yui.yahooapis.com/2.9.0/build/container/container_core-min.js"></script>
<script src="http://yui.yahooapis.com/2.9.0/build/menu/menu-min.js"></script>
<script src="http://yui.yahooapis.com/2.9.0/build/button/button-min.js"></script>
<!-- Source file for Rich Text Editor-->
<script src="http://yui.yahooapis.com/2.9.0/build/editor/editor-min.js"></script>
<script type="text/javascript">
var myEditor = new YAHOO.widget.Editor('myEditor', {
height: '300px',
width: '522px',
dompath: true,
animate: true
});
myEditor.render();
</script>
</head>
<body>
<div class="yui-skin-sam">
<form method="post" action="#" id="form1">
<textarea id="myEditor" name="editor" rows="20" cols="75">
</textarea>
</form>
</div>
</body>