Monday, March 19, 2012

AjaxToolKit Editor example in Asp.Net c#



***********************************************************************

<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>

<%@ Register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit.HTMLEditor" tagprefix="cc2" %>

<!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 runat="server">
    <title>AjaxToolKit Editor in Asp.Net c#</title>
    <style type="text/css">
       
    .htmleditor
    {
    width:500px;
    height:200px;
    }
    .htmleditor .ajax__htmleditor_editor_container
    {
    border: 1px solid #C2C2C2;
    }
    .htmleditor .ajax__htmleditor_editor_toptoolbar
    {
    background-color:#F0F0F0; padding: 0px 2px 2px 2px;
    }
    .htmleditor .ajax__htmleditor_editor_toptoolbar .ajax__htmleditor_toolbar_button
    {
    background-color:#C2C2C2; margin:2px 0px 0px 0px;
    }
    .htmleditor .ajax__htmleditor_editor_toptoolbar .ajax__htmleditor_toolbar_button_hover
    {
    background-color:#3C8AFF;
    }
    .htmleditor .ajax__htmleditor_editor_toptoolbar div.ajax__htmleditor_toolbar_button span.ajax__htmleditor_toolbar_selectlable
    {
    font-family:Arial; font-size:12px; font-weight:bold;
    }
    .htmleditor .ajax__htmleditor_editor_toptoolbar div.ajax__htmleditor_toolbar_button select.ajax__htmleditor_toolbar_selectbutton
    {
    font-size:12px; font-family:arial; cursor:pointer;
    }
    .htmleditor .ajax__htmleditor_editor_toptoolbar div.ajax__htmleditor_toolbar_button select.ajax__htmleditor_toolbar_selectbutton option
    {
    font-size:12px;
    }
    .htmleditor .ajax__htmleditor_editor_editpanel
    {
    border-width: 0px;
    border-top: 1px solid #C2C2C2;
    border-bottom: 1px solid #C2C2C2;
    }
    .htmleditor .ajax__htmleditor_editor_bottomtoolbar
    {
    background-color:#F0F0F0; padding: 0px 0px 2px 2px;
    }
    .htmleditor .ajax__htmleditor_editor_bottomtoolbar .ajax__htmleditor_toolbar_button
    {
    background-color:#C2C2C2; margin:0px 4px 0px 0px;
    }
    .htmleditor .ajax__htmleditor_editor_bottomtoolbar .ajax__htmleditor_toolbar_button_hover
    {
    background-color:#3C8AFF;
    }

    </style>
</head>
<body>
    <form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <div>
    <h2>AjaxToolKit Editor example in Asp.Net c#</h2>
   
    <p>
     
        <cc2:Editor ID="Editor1" runat="server" CssClass="htmleditor"/>
    </p>
    <p>
        <asp:Button ID="Button1" runat="server" Text="Get Text"
            onclick="Button1_Click" />
    </p>
    <p id="result" runat="server"></p>
    </div>
    </form>
</body>
</html>


***********************************************************************

using System;

public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }
    protected void Button1_Click(object sender, EventArgs e)
    {
        result.InnerHtml = Editor1.Content;
    }
}

*********************************************************************** 


Post a Comment