segunda-feira, 5 de março de 2012

Formatação em Colunas do GridView



Frequentemente quando utilizamos um controle do tipo GridView, e inserimos valores do tipo Data, Dinheiro, Inteiros ou Decimais, precisamos formatar esse valor de acordo com a finalidade desse Campo. Nesse artigo apresentarei a propriedade DataFormatString da BoundColumn de um DataGrid.

Existem dois tipos de formatação:

                 ·         Standard Formats;

                 ·         Custom Formats.


Como o objetivo do artigo é mostrar as formatações mais utilizadas em aplicativos para serem executados nos padrões brasileiros, então deixarei claro o seguinte: O padrão para valores numéricos será adotado o Stardand Format. Já a formatação para datas, será utilizado o Custom Format.

A propriedade DataFormatString fornece uma formatação customizada para o valor inserido na BoundColumn. Esta propriedade consiste em duas partes separadas por dois pontos estando dentro de um par de chaves da seguinte forma: {:}. Isso é válido apenas quando estiver inserindo na BoundColumn valores numéricos ou do tipo data.

A sintaxe é a seguinte: {0:[Formato][Qtde. Casas Decimais]}. O caracter que vem após os dois pontos, é o formato em que o valor será exibido. Você também poderá optar por definir a quantidade de casas decimais da seguinte forma: {0:C2}. A seguir uma lista com os valores possíveis:



Standard Format
Descrição
C
Exibe o valor no formato de moeda.
D
Exibe o valor em formato decimal.
E
Exibe o valor no formato cientìfico (exponencial).
F
Exibe o valor no formato fixo.
G
Exibe o valor no formato geral.
N
Exibe o valor no formato numérico.
P
Exibe o valor no formato de porcentagem.
X
Exibe o valor no formato hexadecimal.



NOTA: Os caracteres acima que especificam o formato a ser exibido não são case-sensitive, exceto para o X, pois se ele for minúsculo, os valores serão apresentados em minúsculo, do contrário, serão exibidos em maiúsculo.

Para configurar os valores no GridView, clique com o botão direito do mouse em cima do mesmo, e selecione Property Builder. Em seguida, vá até a aba Columns e ao incluir uma nova BoundColumn, a propriedade DataFormatString será habilitada para que você possa definir a formatação customizada. A imagem abaixo ilustra o processo:


A figura abaixo exibe os valores no GridView de acordo com a formatação pré-definida na propriedade DataFormatString.


 Aqui chamo a atenção para a coluna onde é exibido o valor no formato moeda e o separador de casas decimais. Como não foi definido nenhuma cultura no arquivo Web.Config, por padrão ele adota as configurações regionais definidas no servidor. Se acrescentar a cultura pt-BR nas configurações de nossa aplicação, verão que os valores passarão a serem exibidos no formato brasileiro. Abaixo a ilustrução deixará claro:

<globalization requestEncoding="utf-8" responseEncoding="utf-8" culture="pt-br" />

Tal alteração é realizada no arquivo web.config. A figura abaixo mostra como ficou após a alteração.


 Além das configurações para valores numéricos, ainda podemos utilizar a propriedade DataFormatString para formatarmos datas que são inseridas no DataGrid. Abaixo uma tabela as as possibilidades de formatação para datas:


Custom Format
Descrição
MM/dd/yyyy
Formato Mês/Dia/Ano
dd/MM/yyyy
Formato Dia/Mês/Ano
hh:mm
Formato Hora:Minuto
hh:mm:ss
Formato Hora:Minuto:Segundo
dd/MM/yyyy hh:mm:ss
Formato Dia/Mês/Ano Hora:Minuto:Segundo



NOTA: Devemos nos atentarmos para o MM e para o mm, pois maiúsculo significa Mês, já o minúsculo significa Minutos.

Como dito anteriormente, a configuração da formatação para data, funciona da mesma forma que a formatação para valores numéricos, ou seja, você define na propriedade DataFormatString da BoundColumn do GridView, como por exemplo: {0:dd/MM/yyyy hh:mm:ss}.

NOTA: Você poderia também ao invés de barras "/" utilizar o hífen "-" como separador para as Datas, ficando a String de formatação da seguinte forma: {0:dd-MM-yyyy hh:mm:ss}.

Poderá também fazer a formatação diretamente no HTML, utilizando a propriedade DataItem em conjunto com a método Format. Exemplo:

<asp:TemplateColumn>

<%# String.Format("{0:c}", Convert.ToInt32(Container.DataItem("NomeDaColuna"))) %>

</asp:TemplateColumn>

quinta-feira, 1 de março de 2012

Teclas de Atalhos - Visual Studio

Não precisamos nem falar muito sobre este assunto, pois as teclas de atalhos facilitam e agilizam o nosso trabalho.

 


Vejamos algumas dessas teclas utilizadas no Visual Studio:

F12

Go To Definition (ir para a definição do objeto selecionado)
CTRL+ "-" (hífen)
Voltar para a posição anterior do cursor (inverso do F12)

CTRL+M+O
Outlining > Collapse To Definitions

CTRL+K+C
(CTRL+E+C)


Comentar linhas selecionadas


CTRL+K+U
(CTRL+E+U)

Descomentar linhas selecionadas

CTRL+K+D


Indentar código selecionado (caso não tenha nenhuma linha selecionada, indenta o arquivo todo)

CTRL+SHIFT+S

Salvar solução completa

CTRL+S

Salvar o arquivo atual

 
SHIFT+F6

Build Project

F6
(CTRL+SHIFT+B)


Build Solution

CTRL+Pause


Cancel Build (apenas durante os processos de Build Project ou Build Solution)

F9

Adicionar BreakPoint

CTRL+SHIFT+F9

Remover todos os BreakPoints da solução

F10

Step Over (Debug)

F11

Step Into (Debug)

SHIFT+F12
(CTRL+K+R)

Find All References (ou Find Symbol Results)


 

O site da Microsoft nos fornece mais detalhes:

http://www.microsoft.com/download/en/details.aspx?displaylang=en&id=13189

sexta-feira, 10 de fevereiro de 2012

Validação de campos utilizando expressões regulares

   O exemplo que se segue, mostra como podemos validar campos utilizando expressões regulares:


<script>

   function mascara(o,f){

       v_obj=o

       v_fun=f

       setTimeout("execmascara()",1)

   }


   function execmascara(){

       v_obj.value=v_fun(v_obj.value)
   }


   function leech(v){

      v=v.replace(/o/gi,"0")

       v=v.replace(/i/gi,"1")

       v=v.replace(/z/gi,"2")

       v=v.replace(/e/gi,"3")

       v=v.replace(/a/gi,"4")

       v=v.replace(/s/gi,"5")

       v=v.replace(/t/gi,"7")

       return v

   }


   function soNumeros(v){
  
       return v.replace(/\D/g,"")
   }


   function telefone(v){

            //Remove tudo o que não é dígito
       v=v.replace(/\D/g,"")                

         //Adiciona parênteses em volta dos dois primeiros dígitos
       v=v.replace(/^(\d\d)(\d)/g,"($1) $2")

         //Adiciona hífen entre o quarto e o quinto dígitos
       v=v.replace(/(\d{4})(\d)/,"$1-$2")   
     
      return v

   }


   function cpf(v){

         //Remove tudo o que não é dígito
       v=v.replace(/\D/g,"")                   
        
         //Coloca um ponto entre o terceiro e o quarto dígitos
       v=v.replace(/(\d{3})(\d)/,"$1.$2")      

       v=v.replace(/(\d{3})(\d)/,"$1.$2")      

         //de novo (para o segundo bloco de números)
         //Coloca um hífen entre o terceiro e o quarto dígitos
       v=v.replace(/(\d{3})(\d{1,2})$/,"$1-$2")

     return v

   }


   function cep(v){

         //Remove tudo o que não é dígito
       v=v.replace(/D/g,"")               
      
         v=v.replace(/^(\d{5})(\d)/,"$1-$2")

      return v

   }
 

   function cnpj(v){

         //Remove tudo o que não é dígito
       v=v.replace(/\D/g,"")                          
      
         //Coloca ponto entre o segundo e o terceiro dígitos
         v=v.replace(/^(\d{2})(\d)/,"$1.$2")            

        //Coloca ponto entre o quinto e o sexto dígitos
       v=v.replace(/^(\d{2})\.(\d{3})(\d)/,"$1.$2.$3")

         //Coloca uma barra entre o oitavo e o nono dígitos
       v=v.replace(/\.(\d{3})(\d)/,".$1/$2")          

         //Coloca um hífen depois do bloco de quatro dígitos
       v=v.replace(/(\d{4})(\d)/,"$1-$2")             

     return v
   }
 

   function romanos(v){

         //Maiúsculas
       v=v.toUpperCase()            

         //Remove tudo o que não for I, V, X, L, C, D ou M
       v=v.replace(/[^IVXLCDM]/g,"")
   
       while(v.replace(/^M{0,4}(CM|CD|D?C{0,3})(XC|XL|L?X{0,3})(IX|IV|V?I{0,3})$/,"")!="")

      v=v.replace(/.$/,"")

       return v
   }
 

   function site(v){

       v=v.replace(/^http:\/\/?/,"")

       dominio=v

       caminho=""

       if(v.indexOf("/")>-1)

           dominio=v.split("/")[0]

           caminho=v.replace(/[^\/]*/,"")

       dominio=dominio.replace(/[^\w\.\+-:@]/g,"")

       caminho=caminho.replace(/[^\w\d\+-@:\?&=%\(\)\.]/g,"")

       caminho=caminho.replace(/([\?&])=/,"$1")

       if(caminho!="")dominio=dominio.replace(/\.+$/,"")

          v="http://"+dominio+caminho

       return v
   }
</script>
 


<h1>Exemplos de expressões regulares</h1>

    <label for="inumeros">Apenas números:

    <input id="inumeros" onkeypress="mascara(this,soNumeros)" /></label>

    <label for="itelefone">Número Telefone:

  <input id="itelefone" onkeypress="mascara(this,telefone)" maxlength="14" /></label>

    <label for="icpf">CPF:

    <input id="icpf" onkeypress="mascara(this,cpf)" maxlength="14" /></label>

    <label for="icep">CEP:

    <input id="icep" onkeypress="mascara(this,cep)" maxlength="9" /></label>

    <label for="icnpj">CNPJ:

    <input id="icnpj" onkeypress="mascara(this,cnpj)" maxlength="18" /></label>

    <label for="iromanos">Números Romanos:

    <input id="iromanos" onkeypress="mascara(this,romanos)" maxlength="18" /></label>

  

terça-feira, 7 de fevereiro de 2012

Desativar tecla F5 e CRTL+R utilizando JavaScript

Para não permitir atualização da página no navegador Internet Explorer, podemos adicionar o seguinte código JavaScript entre da tag <head></head>.


 
<head runat="server">
      <title></title>
      <script language=javascript>    
         document.onkeydown = function () { 
           switch (event.keyCode) {
             case 116 :  
                event.returnValue = false;
                event.keyCode = 0;           
                return false;             
              case 82 : 
                if (event.ctrlKey) {  
                   event.returnValue = false;
                  event.keyCode = 0;             
                  return false;
           }
         }
    
     </script>
</head>

Este exemplo desativa o refresh em páginas web quando o usuário utilizar F5 ou CTRL + F5.

Ele funciona adicionando uma função onkeydown à página.

O event.keyCode, obtem qual botão foi precionado 116 para a tecla F5 e 82 para R.

O if para R verifica se o botão de controle foi pressionado ao mesmo tempo como R, marcando assim event.crtKey.

Entretanto, não tem como controlar o botão de atualização para a barra de endereço do navegador.