Há muito tempo atrás, em uma galáxia muito, muito distante… existiam uns programadores asp que se matavam pra fazer editor html no site sem recorrer a componentes pagos, aqueles componentes que davam inveja por serem tão visualmente agradáveis e compatíveis com vários navegadores. Eu fui um deles!

Pois é, esse tempo já era mesmo, “tô ficando velho”, diria o coringa. Há alguns anos a Microsoft disponibilizou o AJAX Control Toolkit, uma coleção de componentes AJAX de fácil integração aos projetos em ASP.net.

Um desses componentes é o HTMLEditor, que torna “mamão com açúcar” a tarefa de disponibilizar um editor em seu site, útil principalmente na área de administração de conteúdo, para seu cliente detonar o site formatar os textos do jeito que ele achar melhor.

Primeiro passo: download do AJAXControlToolkitBinary.zip, bem aqui. Esta versão é para o framework 3.5. Para o  2.0, você deve pegar uma versão mais antiga, aqui.

Depois de descompactar o arquivo, copie o “AjaxControlToolkit.dll” na pasta “Bin” da sua aplicação.

Cole o código abaixo no início de seu arquivo “.aspx”, após a diretiva “@ Page”:

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit.HTMLEditor" TagPrefix="HTMLEditor" %>

Após a tag <form …> do “.aspx”, insira o código abaixo, para chamar  o controle ScriptManager, que gerencia os scripts de cliente no AJAX ASP.net:

<asp:ScriptManager ID="ScriptManager1" runat="server" />

E, onde você deseja exibir o editor, insira o código:

<HTMLEditor:Editor ID="Editor1" runat="server" Height="300px" Width="100%" AutoFocus="true" />

Se você executar a página neste momento, voilà! Você já vê o editor em funcionamento, com sua configuração de botões padrão.

Agora, vamos pegar o conteúdo desse editor para fazer algo útil, não é? Pois bem, insira um “label” e um “button” no aspx, e no evento “onclick” do botão, a instrução:

Label1.Text = Editor1.Content

É só isso? Sim, é.

E se você navegar pelo site do ASP.NET AJAX Control Toolkit, vai achar muita coisa interessante para sua aplicação, com a “mágica” do AJAX.

Abraços!