What's New?

[CLOSED] Editing cell of gridPanel

Threaded View

Previous Post Previous Post   Next Post Next Post
  1. #1
    Jan 25, 2012, 6:04 PM

    [CLOSED] Editing cell of gridPanel

    Hi

    I try follow the exemple https://examples2.ext.net/#/GridPane..._DirectMethod/...

    If I double-click in cell of gridPanel, it works...
    If I press the ENTER key, a error occurs...

    Attachment 3763

    I have a listener in gridPanel
    <Listeners>
   <Render Handler="this.on('keydown', startEditing);" />
</Listeners>
    and in the gridview (exactly as shown in the example https://examples2.ext.net/#/GridPane..._DirectMethod/)
    <View>
   <ext:GridView ID="GridView1" runat="server">
       <Listeners>
             <Render Handler="this.el.on('keydown', startEditing);" />
        </Listeners>
  </ext:GridView>
</View>
    JavaScript codes to events is these:

    var startEditing = function (e) {
        if (e.getKey() === e.ENTER) {
            var grid = <%=grdCotacoesItemsSGCO.ClientID%>,
                record = grid.getSelectionModel().getSelection()[0],
                column = grid.columns[1];
                <%=CellEditing1.ClientID%>.startEdit(record, column); //[0] é linha, [1] é coluna
        }
    };
    The only thing that might be different from the example is SelectionModel
    <SelectionModel>
     <ext:CellSelectionModel ID="csmCotacoesItemsSGCO" runat="server" Mode="Single" />
</SelectionModel>
    And the Editor tag:

    <Editor>
     <ext:TextField ID="TextField2" runat="server" SelectOnFocus="true" />
</Editor>
    any help? I'm forgetting something?

    Follow the entire code for ascx (usercontrol)...

    <%@ Control Language="vb" AutoEventWireup="false" CodeBehind="Cotacoes_Fornecedores_Confirma.ascx.vb" Inherits="SuperaWeb.Cotacoes_Fornecedores_Confirma" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<%--<%@ Register src="~/App/Tools/DataSearch.ascx" tagname="DataSearch" tagprefix="superaWebControl" %>--%>

<script runat="server">
    
    Protected Sub ConfirmaCotacao(sender As Object, evt As Ext.Net.DirectEventArgs)
        If ValidaCampoCondicoes() Then
            Dim jsonValues As String = evt.ExtraParams("values")
            Dim records As ArrayList = SuperaWeb.Library.JSon.Deserializer(jsonValues)
            Dim record As Hashtable
        
            For Each record In records
                Me.Confirm(Convert.ToInt64(record("IDCotacaoItem")), Convert.ToDecimal(SuperaWeb.Library.General.setDecimalSeparatorToComma(record("ValorUnitario"))), Convert.ToDecimal(SuperaWeb.Library.General.setDecimalSeparatorToComma(record("Desconto"))))
            Next
            
            If SaveCondicoes() Then
                Me.CloseWindow()
            End If
        End If
    End Sub
    
    Protected Function ValidaCampoCondicoes() As Boolean
        Dim msg As Ext.Net.MessageBox
        Dim msgConf As Ext.Net.MessageBoxConfig
        
        If txtCondicoesFormaPagamento.Text = "" Then
            msg = New Ext.Net.MessageBox()
            msgConf = New Ext.Net.MessageBoxConfig
            msgConf.Icon = MessageBox.Icon.WARNING
            msgConf.Buttons = MessageBox.Button.OK
            msgConf.Title = "CAMPO REQUERIDO!"
            msgConf.Message = "o campo 'Condições de Pagamento' é um campo de informação obrigatória!<br>Informe um valor para o campo."
            msg.Show(msgConf)
            Return False
        End If
        
        If txtCondicoesPrazoEntrega.Text = "" Then
            msg = New Ext.Net.MessageBox()
            msgConf = New Ext.Net.MessageBoxConfig
            msgConf.Icon = MessageBox.Icon.WARNING
            msgConf.Buttons = MessageBox.Button.OK
            msgConf.Title = "CAMPO REQUERIDO!"
            msgConf.Message = "o campo 'Prazo de entrega' é um campo de informação obrigatória!<br>Informe um valor para o campo."
            msg.Show(msgConf)
            Return False
        End If
        
        If txtCondicoesValidadeProposta.Text = "" Then
            msg = New Ext.Net.MessageBox()
            msgConf = New Ext.Net.MessageBoxConfig
            msgConf.Icon = MessageBox.Icon.WARNING
            msgConf.Buttons = MessageBox.Button.OK
            msgConf.Title = "CAMPO REQUERIDO!"
            msgConf.Message = "o campo 'Validade da proposta' é um campo de informação obrigatória!<br>Informe um valor para o campo."
            msg.Show(msgConf)
            Return False
        End If
        
        If txtCondicoesValorFrete.Text = "" Then
            msg = New Ext.Net.MessageBox()
            msgConf = New Ext.Net.MessageBoxConfig
            msgConf.Icon = MessageBox.Icon.WARNING
            msgConf.Buttons = MessageBox.Button.OK
            msgConf.Title = "CAMPO REQUERIDO!"
            msgConf.Message = "o campo 'Valor do frete' é um campo de informação obrigatória!<br>Informe um valor para o campo."
            msg.Show(msgConf)
            Return False
        End If
        
        If Not IsNumeric(txtCondicoesValorFrete.Text) Then
            msg = New Ext.Net.MessageBox()
            msgConf = New Ext.Net.MessageBoxConfig
            msgConf.Icon = MessageBox.Icon.WARNING
            msgConf.Buttons = MessageBox.Button.OK
            msgConf.Title = "CAMPO REQUERIDO!"
            msgConf.Message = "o campo 'Valor do frete' necessita de um valor número válido!<br>Informe um valor númerico válido para o campo."
            msg.Show(msgConf)
            Return False
        End If
        Return True
    End Function
    
    Protected Sub Cancel_Click(sender As Object, evt As Ext.Net.DirectEventArgs)
        Me.CloseWindow(True)
    End Sub
   
</script>

<script type="text/javascript" >
    
    function getCotacoesItemsSGCOFilter() {
        var sFilter = "SuperaWeb=1";
        sFilter = "IDCotacao = " + <%=txtIDCotacao.ClientID%>.getValue() + " And IDFornecedor = " + <%=txtIDFornecedor.ClientID%>.getValue();
        return sFilter;
    }

    var valorTotalColumnRender = function (v, p, record, rowIndex) {
        var recordAux = <%=grdCotacoesItemsSGCO.ClientID%>.store.getAt(rowIndex);
        return Format_brMoney(recordAux.get('ValorUnitarioOriginal') * recordAux.get('Quantidade'));
    };
        
    var startEditing = function (e) {
        if (e.getKey() === e.ENTER) {
            var grid = <%=grdCotacoesItemsSGCO.ClientID%>,
                record = grid.getSelectionModel().getSelection()[0],
                column = grid.columns[1];
                <%=CellEditing1.ClientID%>.startEdit(record, column); //[0] é linha, [1] é coluna
        }
    };

    var afterEdit = function (editor, e) {
        /*
        Properties of 'e' include:
            e.grid - This grid
            e.record - The record being edited
            e.field - The field name being edited
            e.value - The value being set
            e.originalValue - The original value for the field, before the edit.
            e.row - The grid row index
            e.column - The grid column index
        */
            
        // Call DirectMethod
        //CompanyX.AfterEdit(e.record.data.ID, e.field, e.originalValue, e.value, e.record.data);
    };
    
  function getRecords(v) {
        //o objetivo desta função é pegar o Records do grid, porém convertendo os campos Quantidade, ValorUnitario, ValorUnitarioOriginal e Desconto, que estão formatados com , (vírgula)
        //e precisam ser formatados com ., senão eles vão dar erro na hora de deserializar com o Json, pois, no Json, virgula é separador de campo.
    
        for (i = 0; i < v.length; i++) {
            v[i]['Quantidade'] = setDecimalSeparatorToDot(v[i]['Quantidade']); //quantidade
            v[i]['ValorUnitarioOriginal'] = setDecimalSeparatorToDot(v[i]['ValorUnitarioOriginal']); //valor unitário original
            v[i]['ValorUnitario'] = setDecimalSeparatorToDot(v[i]['ValorUnitario']); //valor unitário
            v[i]['Desconto'] = setDecimalSeparatorToDot(v[i]['Desconto']); //desconto
        }
        return v;
    }

    var KeyUpHandler_ValorFrete = function (f, e) {
        formatMoney(f, e);
        return false;
    };

</script>

<ext:Window 
    ID="wndCotacoesEmpresaConfirma" 
    runat="server"
    Icon="MoneyAdd"
    Title="Cotação WEB"
    Width="1000" 
    Height="600"
    AutoShow="false" 
    Modal="true" 
    Resizable="false"
    PaddingSummary="5px 5px 5px 5px"
    Hidden="true"
    ButtonAlign="Right"
    Layout="FitLayout">
    <Items>
        <ext:Panel ID="Panel1" runat="server" Border="true" BodyPadding="3" Layout="AbsoluteLayout" Header="false">
            <Items>
                <ext:Panel runat="server" ID="panelCabecalho" Layout="AbsoluteLayout" Border="false" Header="false" X="5" Y="5" Height="75px">
                    <Items>
                        <ext:Image runat="server" ID="imgLogo" X="20" Y="5" Width="55" Height="60"  StyleSpec="border: 0px solid #99ccff" ImageUrl="~/dbproperties/logo.jpg" />
                        <ext:DisplayField runat="server" ID="txtRelatorioCabecalho" X="90" Y="10" Width="500" text="" />
                    </Items>
                </ext:Panel>
                <ext:FieldSet runat="server" ID="fsSolicitacao" Title="Solicitação de Cotação de Preços" Layout="AbsoluteLayout" X="10" Y="85" Height="85px" Width="470px">
                    <Items>
                        <ext:Label runat="server" ID="lblCotacaoRequisicaoNumero" Text="Requisição" X="5" Y="10" Width="70px" />
                        <ext:Label runat="server" ID="lblCotacaoDescricao" Text="Descrição" X="200" Y="10" Width="70px" />
                        <ext:Label runat="server" ID="lblCotacaoIDObra_Nome" Text="Obra" X="5" Y="25" Width="70px" />
                        <ext:Label runat="server" ID="lblCotacaoIDUsuarioResponsavel_Nome" Text="Responsável" X="5" Y="40" Width="70px" />
                        <ext:Label runat="server" ID="lblCotacaoIDUsuarioResponsavel_Email" Text="E-mail" X="200" Y="40" Width="70px" />
                        <ext:DisplayField runat="server" ID="txtCotacaoRequisicaoNumero" X="75" Y="10" Width="150px" text="" />
                        <ext:DisplayField runat="server" ID="txtCotacaoDescricao" X="260" Y="10" Width="350px" text="" />
                        <ext:DisplayField runat="server" ID="txtCotacaoIDObra_Nome" X="75" Y="25" Width="150px" text="" />
                        <ext:DisplayField runat="server" ID="txtCotacaoIDUsuarioResponsavel_Nome" X="75" Y="40" Width="150px" text="" />
                        <ext:DisplayField runat="server" ID="txtCotacaoIDUsuarioResponsavel_Email" X="260" Y="40" Width="150px" text="" />
                    </Items>
                </ext:FieldSet>
                <ext:FieldSet runat="server" ID="fsFornecedor" Title="Confirmação do Fornecedor" Layout="AbsoluteLayout" X="490" Y="85" Height="85px" Width="470px">
                    <Items>
                        <ext:Label runat="server" ID="lblFornecedorNome" Text="Fornecedor" X="5" Y="10" Width="70px" />
                        <ext:Label runat="server" ID="lblFornecedorTelefone" Text="Telefone" X="5" Y="25" Width="70px" />
                        <ext:Label runat="server" ID="lblFornecedorContato" Text="Contato" X="5" Y="40" Width="70px" />
                        <ext:Label runat="server" ID="lblFornecedorEmail" Text="E-mail" X="200" Y="40" Width="70px" />
                        <ext:DisplayField runat="server" ID="dsFornecedorNome" X="67" Y="10" Width="150px" text="" />
                        <ext:DisplayField runat="server" ID="dsFornecedorTelefone" X="67" Y="25" Width="150px" text="" />
                        <ext:DisplayField runat="server" ID="dsFornecedorContato" X="67" Y="40" Width="150px" text="" />
                        <ext:DisplayField runat="server" ID="dsFornecedorEmail" X="240" Y="40" Width="150px" text="" />
                    </Items>
                </ext:FieldSet>
                <ext:Panel runat="server" ID="panelGrid" Layout="FitLayout" BodyPadding="5" X="10" Y="175" Width="950" Height="200px" BodyStyle="background-color: #F9F9F9">
                    <Items>
                    <ext:GridPanel runat="server" ID="grdCotacoesItemsSGCO" Frame="true" Height="300px" ButtonAlign="Left">
                            <Store>
                                <ext:Store ID="Store1" runat="server" RemoteSort="true">
                                    <Proxy>
                                        <ext:AjaxProxy Json="true" Url="~/App/JSonDataPaging.asmx/CotacoesItemsSGCO_Paging">
                                            <ActionMethods Read="POST" />
                                            <Reader>
                                                <ext:JsonReader Root="d.Data" TotalProperty="d.TotalRecords" />
                                            </Reader>
                                        </ext:AjaxProxy>
                                    </Proxy>
                                    <AutoLoadParams>
                                        <ext:Parameter Name="start" Value="0" Mode="Raw" />
                                        <ext:Parameter Name="limit" Value="9999" Mode="Raw" />
                                    </AutoLoadParams>
                                    <Parameters>
                                        <ext:StoreParameter Name="filter" Value="getCotacoesItemsSGCOFilter()" Mode="Raw" />
                                    </Parameters>
                                    <Model>
                                        <ext:Model runat="server" IDProperty="IDCotacaoItem" >
                                            <Fields>
                                                <ext:ModelField  Name="IDCotacaoItem" />
                                                <ext:ModelField  Name="IDCotacao" />
                                                <ext:ModelField  Name="IDInsumo" />
                                                <ext:ModelField  Name="IDInsumo_Descricao" />
                                                <ext:ModelField  Name="IDInsumo_Unidade" />
                                                <ext:ModelField  Name="IDFornecedor" />
                                                <ext:ModelField  Name="Quantidade" Type="Float" />
                                                <ext:ModelField  Name="ValorUnitario" Type="Float" />
                                                <ext:ModelField  Name="Desconto" Type="Float" />
                                                <ext:ModelField  Name="ValorUnitarioOriginal" Type="Float" />
                                                <ext:ModelField  Name="DataEntrega" Type="Date" DateFormat="M$" />
                                            </Fields>
                                        </ext:Model>
                                    </Model>
                                    <Sorters>
                                        <ext:DataSorter Property="IDCotacaoItem" Direction="ASC" />
                                    </Sorters>
                                </ext:Store>
                            </Store>
                            <ColumnModel ID="ColumnModel1" runat="server">
                                <Columns>
                                    <ext:Column runat="server" Text="Descrição" DataIndex="IDInsumo_Descricao" Width="330px"  Sortable="true"  />
                                    <ext:Column runat="server" Text="Unidade" DataIndex="IDInsumo_Unidade" Width="110px"  Sortable="true"  />
                                    <ext:Column runat="server" Text="Quantidade" DataIndex="Quantidade" Width="90px"  Sortable="true" Align="Right">
                                        <Renderer Fn="Format_brFloat" />
                                    </ext:Column>
                                    <ext:Column runat="server" Text="Valor unitário" DataIndex="ValorUnitarioOriginal" Width="90px"  Sortable="true" Align="Right">
                                        <Renderer Fn="Format_brMoney"  />
                                    </ext:Column>
                                    <ext:Column runat="server" Text="Valor total" DataIndex="" Width="90px"  Sortable="true"  Align="Right" >
                                        <Renderer Fn="valorTotalColumnRender"  />
                                    </ext:Column>
                                    <ext:Column runat="server" Text="Valor confirmado" DataIndex="ValorUnitario" Width="110px"  Sortable="true" Align="Right">
                                        <Renderer Fn="Format_brMoney"  />
                                        <Editor>
                                            <ext:TextField ID="TextField1" runat="server" SelectOnFocus="true"/>
                                        </Editor>
                                    </ext:Column>
                                    <ext:Column runat="server" Text="Desconto" DataIndex="Desconto" Width="80px" Sortable="true" Align="Right" >
                                        <Renderer Fn="Format_brMoney"  />
                                        <Editor>
                                            <ext:TextField ID="TextField2" runat="server" SelectOnFocus="true" />
                                        </Editor>
                                    </ext:Column>
                                </Columns>
                            </ColumnModel>
                            <Listeners>
                                <Render Handler="this.on('keydown', startEditing);" />
                            </Listeners>
                            <SelectionModel>
                                <ext:CellSelectionModel ID="csmCotacoesItemsSGCO" runat="server" Mode="Single" />
                            </SelectionModel>
                            <View>
                                <ext:GridView ID="GridView1" runat="server">
                                    <Listeners>
                                        <Render Handler="this.el.on('keydown', startEditing);" />
                                    </Listeners>
                                </ext:GridView>
                            </View>
                            <Plugins>
                                <ext:CellEditing ID="CellEditing1" runat="server">
                                    <Listeners>
                                        <Edit Fn="afterEdit" />
                                    </Listeners>
                                </ext:CellEditing>
                            </Plugins>
                        </ext:GridPanel>
                    </Items>
                </ext:Panel> 
                <ext:FieldSet runat="server" ID="fsCondicoes" Title="Condições" Layout="AbsoluteLayout" X="10" Y="380" Height="140px" Width="470px">
                    <Items>
                        <ext:TextField runat="server" ID="txtCondicoesFormaPagamento" FieldLabel="Forma de pagamento" MaxLength="20" X="5" Y="5" LabelWidth="110" Width="210px" />
                        <ext:TextField runat="server" ID="txtCondicoesPrazoEntrega" FieldLabel="Prazo de entrega" MaxLength="20" X="5" Y="30" LabelWidth="110" Width="210px"  />
                        <ext:TextField runat="server" ID="txtCondicoesValidadeProposta" FieldLabel="Validade da proposta" MaxLength="20" X="225" Y="5" LabelWidth="110" Width="210px" />
                        <ext:TextField runat="server" ID="txtCondicoesValorFrete" FieldLabel="Valor do frete (R$)" MaxLength="20" X="225" Y="30" LabelWidth="110" Width="210px" EnableKeyEvents="true" StyleSpec="text-align:right" >
                            <Listeners>
                                <KeyUp Fn="KeyUpHandler_ValorFrete" />
                            </Listeners>
                        </ext:TextField>
                        <ext:TextArea runat="server" ID="txtCondicoesObservacoes" LabelAlign="Top" FieldLabel="Observações do fornecedor" MaxLength="250" X="5" Y="60" Width="430px" Height="65px" />
                    </Items>
                </ext:FieldSet>
                <ext:FieldSet runat="server" ID="fsObservacoes" Title="Observações" Layout="AbsoluteLayout" X="490" Y="380" Height="140px" Width="470px">
                    <Items>
                        <ext:DisplayField runat="server" ID="dsCotacaoObservacoes" X="5" Y="10" Width="435px" Height="100px" StyleSpec="border:0px solid #99ccff"/>
                    </Items>
                </ext:FieldSet>
                <%--<ext:FieldSet runat="server" ID="fsEndereco" Title="Endereço" LabelAlign="Top" Layout="AbsoluteLayout" Height="115px" PaddingSummary="5px 5px 5px 5px">
                    <Items>
                        <ext:TextField runat="server" ID="txtUF" FieldLabel="UF" X="595" Y="50" Width="40px" />
                    </Items>
                </ext:FieldSet>
                <ext:FieldSet runat="server" ID="fsDocumentos" Title="Documentação" LabelAlign="Top" Layout="AbsoluteLayout" Height="70px" PaddingSummary="5px 5px 5px 5px">
                    <Items>
                        <ext:TextField runat="server" ID="txtCPF" FieldLabel="CPF" X="5" Y="5" Width="120px" />
                        <ext:TextField runat="server" ID="txtIdentidade" FieldLabel="Identidade" X="135" Y="5" Width="120px" />
                        <ext:DateField runat="server" ID="dtNascimento" FieldLabel="Data de Nascimento" X="265" Y="5" Width="120px" AltFormats="d/m/Y|j/n/Y|j/n/y|j/m/y|d/n/y|j/m/Y|d/m/Y|d-m-y|d-m-Y|d/m|d-m|dm|dmy|dmY|d|d-m-Y" Format="dd/MM/yyyy"/>
                    </Items>
                </ext:FieldSet>--%>
            </Items>
        </ext:Panel>
    </Items>
    <Buttons>
        <ext:Button runat="server" id="btnOk" text="Ok" Width="80px" Icon="Tick">
            <DirectEvents>
                <Click OnEvent="ConfirmaCotacao" Failure="Ext.MessageBox.alert('Saving failed', 'Error during ajax event');">
                    <EventMask ShowMask="true" Target="CustomTarget" CustomTarget="={#{wndCotacoesEmpresaConfirma}.body}" />
                    <ExtraParams>                    
                        <ext:Parameter Name="values" Value="Ext.encode(getRecords(#{grdCotacoesItemsSGCO}.getRowsValues()))" Mode="Raw" Encode="true" />
                    </ExtraParams>
                </Click>
            </DirectEvents>
        </ext:Button>
        <ext:Button runat="server" id="btnCancel" text="Cancelar" Width="80px" Icon="Cancel">
            <DirectEvents>
                <Click OnEvent="Cancel_Click" />
            </DirectEvents>
        </ext:Button>
    </Buttons>
</ext:Window>
<ext:Hidden runat="server" ID="txtIDEmpresa" Text="0" />
<ext:Hidden runat="server" ID="txtIDCotacao" Text="0" />
<ext:Hidden runat="server" ID="txtIDFornecedor" Text="0" />
    Last edited by Daniil; Jan 26, 2012 at 4:27 PM. Reason: [CLOSED]

Similar Threads

  1. [CLOSED] How to make the Editable cell Empty if the cell contain a Zero '0' value when editing??
    By Fahd in forum 2.x Legacy Premium Help
    Replies: 4
    Last Post: Jul 10, 2012, 5:35 PM
  2. Gridpanel: change cell's css class on click (eg. toggle the cell background color)
    By ocr in forum 2.x Help
    Replies: 1
    Last Post: Jul 10, 2012, 11:16 AM
  3. [CLOSED] GridPanel.start cell editing when key pressed
    By supera in forum 2.x Legacy Premium Help
    Replies: 10
    Last Post: Mar 01, 2012, 7:04 PM
  4. how to enable gridpanel cell editing feature in asp.net mvc ? thanks!
    By EagleShi in forum 1.x Help
    Replies: 0
    Last Post: Apr 14, 2011, 7:10 AM
  5. [CLOSED] ColumnTree cell editing
    By kenanhancer in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Feb 04, 2011, 7:38 AM

Posting Permissions