Um Grande problema que temos é o trabalho de ficar criando grid com funcionalidades CRUD (Create, Reade, Update e Delete), com este componente e algumas adaptações fica tudo mais fácil.

Um modelo de uma grid personalizada. Notem que na coluna “Descrição” há um marcador vermelho, isto está indicando que foi realizada uma alteração que ainda não foi salva (o mais fantástico é que basta um duplo clique na coluna que ela fica habilitada para edição).

A coluna vencimento é do tipo Data, assim, é possível exibir o DatePicker de uma forma muito simples. Para cada coluna há um “editor. Notem que tudo pode ser configurado (no meu site todas as mensagens estão em portugues, mas, é possível configurar para que recupere a linguagem do cliente e com trabalho mínimo, exibir mensagens em Inglês, Português ou qualquer outro idioma.

Tela de Apresentação da Grid.

Vou colocar o conteúdo HTML necessário para gerar as colunas e editores e alguns itens interessantes, como, Regex para limitar caracteres, agrupadores, enfim, muita coisa bacana, para quem quiser trocar informações, entrem em contato através do email:contato@alexandreminato.com.br

<ColumnModel ID="colModel" runat="server">

<Columns>

<ext:Column ColumnID="IDLancamento" DataIndex="IDLancamento" Header="ID" Width="25" Sortable="true" Hidden="true" />

<ext:Column DataIndex="Vencimento" Header="Vencimento" Width="100" Align="Center" Sortable="true">

<Editor>

<ext:DateField ID="txtVencimento" runat="server" Sortable="true" />

</Editor>

<Renderer Fn="Ext.util.Format.dateRenderer('d/m/Y')" />

</ext:Column>

<ext:Column DataIndex="Descricao" Header="Descricao" Width="210" Sortable="true">

<Editor>

<ext:TextField ID="txtDesc" runat="server" />

</Editor>

</ext:Column>





<ext:GroupingSummaryColumn

ColumnID="Valor"

Header="Valor"

Sortable="true"

DataIndex="ValorPrevisto"

Hideable="false"

SummaryType="Sum">

<Renderer Fn="FormataCor" />

<SummaryRenderer Fn="FormataCor" />

<Editor>

<ext:TextField ID="TextField2" runat="server" MaskRe="/[0-9\,]/" DataIndex="ValorPrevisto" />

</Editor>

</ext:GroupingSummaryColumn>

<ext:CommandColumn ColumnID="Quitar" Width="40" Header="Quitar">

<Commands>

<ext:GridCommand Icon="Accept" CommandName="Quitar" />

</Commands>

</ext:CommandColumn>

</Columns>

</ColumnModel>

Conheçam um dos melhores componentes OpenSource. www.coolite.com

Até a próxima 8-)

Minato