Blog do Neilor

Olá!

Para apresentar uma caixa de confirmação no cliente antes de um formulário ser processado pelo servidor, no caso de um postback (submit para o mesmo script), estamos acostumados a usar um javascript no evento OnClientClick do botão:

<asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="return confirm('Enviar formulário?')" PostBackUrl="default.aspx"/>

Acontece que, quando o formulário tem que ser processado por outro script (cross-page postback), esta instrução não funciona pois, quando você confirma o envio é feito um postback comum, e não acontece o redirecionamento ao script desejado. À primeira vista é uma situação estranha e você pode passar alguns minutos tentando descobrir se há algo errado no javascript, mas não vai encontrar.

Isso acontece porque, nos casos de cross-page postback, o asp.net implementa scripts de cliente para o redirecionamento do formulário, gerando o seguinte código html:

<input type="submit" name="Button1" value="Button" onclick="return confirm('Enviar formulário?');WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(&quot;Button1&quot;, &quot;&quot;, false, &quot;&quot;, &quot;default.aspx&quot;, false, false))" id="Button1" />

Neste código, podemos perceber que a primeira instrução só faz um return do resultado do confirm para o documento e cancela a instrução seguinte.

A solução é implementar o confirm dessa forma:

<asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="if(!confirm('OK?'))return false;" PostBackUrl="default.aspx"/>

Dessa forma, só há o return se o visitante clicar em “cancel”, do contrário, o post do formulário é executado normalmente.

Uma coisa estranha que acontece quando o confirm é inserido num script que tenha validação do asp.net, é pedir a confirmação de envio do form e depois a validação exigir preenchimento de alguns campos.

*Eu vi aqui, no Joteke’s Blog

Abraços!

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!

A validação de CheckBoxList utilizando CustomValidator, no cliente, evita postback ou chamada ajax que dependa do servidor. Isto não elimina a necessidade de validação no code-behind, pois o navegador do usuário pode estar com o javascript desativado, o que “invalidaria” esta validação.

Neste exemplo, o id do meu CheckBoxlist é “txt_menus”. Pois bem, para começar, criamos um campo oculto para guardar a quantidade de items que o CheckBoxList contém:

<asp:HiddenField ID="num_itens" runat="server" />

No code-behind (.vb), quando a lista de items for definida, seja manualmente ou através de uma query, insira o código:

num_itens.Value = txt_menus.Items.Count - 1

Perceba que foi subtraído 1 item do total pois o primeiro item da lista será o “0″ (zero).

De volta ao código da página (.aspx), próximo ao CheckBoxList, inserimos o bloco do CustomValidator:

<asp:CustomValidator ID="ValidaMenus" runat="server" ClientValidationFunction="ValidaMenus">Selecione alguma opção!</asp:CustomValidator>

E a função JavaScript que fará a validação:

function ValidaMenus(source, args)
{
var PrefixoCampos = 'ctl00_ContentPlaceHolder1_'
var MaxItens = document.getElementById(PrefixoCampos + 'num_itens').value;
var Selecionados = 0;
for(i=0; i <= MaxItens; i++)
{
ItemAtual = document.getElementById(PrefixoCampos + 'txt_menus_' + i);
if (ItemAtual.checked == true)
{
Selecionados = Selecionados +1;
}
}
if(Selecionados == 0)
{
return args.IsValid = false;
}
)


Bom, é isso! Depois você personaliza como quiser. No caso de validação de múltiplos controles, recomento o uso do ValidationSummary, sem exibição de “alert”, fica mais elegante e personalizável com css. No meu caso, costumo fazer assim:

<asp:ValidationSummary ID="ValidationSummary1" runat="server" HeaderText="Para continuar, corrija as seguintes pendências:" CssClass="MsgValidacao" ForeColor="" />

Abraço!

Quando fazemos uma dropdownlist com opções geradas do banco de dados, e com “autopostback=true”, é interessante que o item inicial desta lista seja uma instrução, e não um item válido.

Para isso basta incluir o código abaixo após o databind da dropdownlist.

ddl_produtos.Items.Insert(0, "selecione um item abaixo")