[CLOSED] Problem RowEditor with center column and double click to edit

  1. #1

    [CLOSED] Problem RowEditor with center column and double click to edit

    Hi,
    I have posted an example with my problems.
    I don't succeed in centering the checkBox in the column.
    When I change a value in the dropdown or in a checkbox and I click in another checkbox of the same row, I must click twice to change the value.
    Please help me.
    Thank you.

    Jimmy

    <%@ Page Language="C#" %>
    <%@ Import Namespace="System.Collections.ObjectModel" %>
    <%@ Import Namespace="System.Collections.Generic" %>
    <%@ Import Namespace="System.Data" %>
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!X.IsAjaxRequest)
            {
              _loadStoreDecimali();
              _loadStoreMetadati();
            }
        }
        private void _loadStoreDecimali()
        {
          DataTable dt = new DataTable();
          DataRow dr = null;
          dt.Columns.Add("ID");
          dt.Columns.Add("Name");
          dr = dt.NewRow();
          dr["ID"] = "0";
          dr["Name"] = "0";
          dt.Rows.Add(dr);
          dr = dt.NewRow();
          dr["ID"] = "1";
          dr["Name"] = "1";
          dt.Rows.Add(dr);
          dr = dt.NewRow();
          dr["ID"] = "2";
          dr["Name"] = "2";
          dt.Rows.Add(dr);
          dr = dt.NewRow();
          dr["ID"] = "3";
          dr["Name"] = "3";
          dt.Rows.Add(dr);
          dr = dt.NewRow();
          dr["ID"] = "4";
          dr["Name"] = "4";
          dt.Rows.Add(dr);
          this.storeDecimali.DataMember = dt.TableName;
          this.storeDecimali.DataSource = dt;
          this.storeDecimali.DataBind();
        }
        private void _loadStoreMetadati()
        {
          DataTable dt = new DataTable();
          DataRow dr = null;
          
          dt.Columns.Add("Name");
          dt.Columns.Add("idMetadato");
          dt.Columns.Add("flGruppo");
          dt.Columns.Add("flIsNumber");
          dt.Columns.Add("flSomma");
          dt.Columns.Add("vlNrDecimali");
          dr = dt.NewRow();
          dr["Name"] = "Test";
          dr["idMetadato"] = "0";
          dr["flGruppo"] = "0";
          dr["flIsNumber"] = "0";
          dr["flSomma"] = "0";
          dr["vlNrDecimali"] = "0";
          dt.Rows.Add(dr);
          dr = dt.NewRow();
          dr["Name"] = "Test 1";
          dr["idMetadato"] = "1";
          dr["flGruppo"] = "0";
          dr["flIsNumber"] = "1";
          dr["flSomma"] = "0";
          dr["vlNrDecimali"] = "3";
          dt.Rows.Add(dr);
          dr = dt.NewRow();
          dr["Name"] = "Test 2";
          dr["idMetadato"] = "2";
          dr["flGruppo"] = "1";
          dr["flIsNumber"] = "1";
          dr["flSomma"] = "0";
          dr["vlNrDecimali"] = "2";
          dt.Rows.Add(dr);
          this.storeCampiMetadatiAssociati.DataMember = dt.TableName;
          this.storeCampiMetadatiAssociati.DataSource = dt;
          this.storeCampiMetadatiAssociati.DataBind();
        }
    </script>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
        
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
       
        <style type="text/css">
        .x-editor-center .x-form-check-wrap             
        {
          text-align:center;                     
        }
      </style>
        
        <ext:XScript runat="server">
            <script type="text/javascript">
              var decimaliRenderer = function(value) {
                var r = storeDecimali.getById(value);
                if (Ext.isEmpty(r)) {
                  return "";
                }
                return r.data.Name;
              };
               
            </script>
        </ext:XScript>
    </head>
    <body>
        <form runat="server">
            <ext:ResourceManager runat="server" />
            <ext:Store ID="storeDecimali" runat="server">
              <Reader>
                <ext:JsonReader IDProperty="ID">
                    <Fields>
                        <ext:RecordField Name="ID" />
                        <ext:RecordField Name="Name" />
                    </Fields>
                </ext:JsonReader>
              </Reader>         
            </ext:Store>
            <ext:Store ID="storeCampiMetadatiAssociati" runat="server">
              <Reader>
                <ext:JsonReader>
                  <Fields>
                    <ext:RecordField Name="Name" />
                    <ext:RecordField Name="idMetadato" />
                    <ext:RecordField Name="flGruppo" />
                    <ext:RecordField Name="flIsNumber" />
                    <ext:RecordField Name="flSomma" />
                    <ext:RecordField Name="vlNrDecimali" />
                  </Fields>
                </ext:JsonReader>
              </Reader>
            </ext:Store>
              
            <ext:GridPanel 
            ID="gridCampiMetadatiAssociati" 
            runat="server" 
            StoreID="storeCampiMetadatiAssociati"
            DDGroup="GridDDCampiMetadati"
            EnableDragDrop="true"
            StripeRows="true"
            AutoExpandColumn="Name"
            Width="368"
            Height="300"
            Title="Campi fissi associati"
            ClicksToEdit="1">
            <Plugins>
                <ext:EditableGrid ID="EditableGrid1" runat="server" />
            </Plugins>
            <ColumnModel>
              <Columns>
                  <ext:Column ColumnID="Name" Header="Campo metadato" Width="100" DataIndex="Name" />
                  <ext:Column DataIndex="idMetadato" Hidden="true" Width="0"/>
                  <ext:Column DataIndex="flGruppo" Header="Gr." Width="37" ColumnID="flGruppo" Align="Center" Sortable="false" Css="x-editor-center">
                    <Editor>
                      <ext:Checkbox ID="ckGruppo" runat="server" CtCls="x-editor-center" Cls="x-editor-center">
                        <Listeners>              
                          <Change Handler="this.onClick();" />             
                        </Listeners> 
                      </ext:Checkbox>
                    </Editor>
                    <EditorOptions Offsets="0,-4"/>
                  </ext:Column>
                  <ext:Column DataIndex="flIsNumber" Header="Num." Width="37" ColumnID="flIsNumber" Align="Center">
                    <Editor>
                      <ext:Checkbox ID="ckIsNumber" runat="server">
                        <Listeners>              
                          <Change Handler="this.onClick();" />             
                        </Listeners>
                      </ext:Checkbox>
                    </Editor>
                  </ext:Column>
                  <ext:Column DataIndex="flSomma" Header="Sum" Width="37" ColumnID="flSomma" Align="Center">
                    <Editor>
                      <ext:Checkbox ID="ckSommaMetadato" runat="server">
                        <Listeners>              
                          <Change Handler="this.onClick();" />             
                        </Listeners>
                      </ext:Checkbox>
                    </Editor>
                  </ext:Column>
                  <ext:Column 
                    Header="Decimali" 
                    DataIndex="vlNrDecimali" 
                    Width="50" 
                    Sortable="false">
                    <Editor>                        
                        <ext:ComboBox ID="cbDecimaliMetadati" 
                            Editable="false"
                            runat="server" 
                            Shadow="Drop" 
                            Mode="Local" 
                            TriggerAction="All" 
                            StoreID="storeDecimali" 
                            DisplayField="Name" 
                            ValueField="ID"
                            />
                    </Editor>
                    <Renderer Fn="decimaliRenderer" />
                </ext:Column>
              </Columns>
            </ColumnModel>
            <View>
             <ext:GridView ID="GridView2" runat="server" MarkDirty="false" />
            </View>
            <SelectionModel>
              <ext:RowSelectionModel ID="RowSelectionModel8" runat="server" />
            </SelectionModel>
          </ext:GridPanel>
        </form>  
    </body>
    </html>
    Last edited by Daniil; Apr 11, 2011 at 1:03 PM. Reason: [CLOSED]
  2. #2
  3. #3
    Hi Daniil,
    I had already read the first thread, and I already use the RowEditor with ComboBox.
    For the second thread I already use column with checkbox for editor.

    Jimmy
  4. #4
    Well, I see that you use EditableGrid plugin, not RowEditor.

    "Focus" is already fixed several months ago (excluding the case when you edit one column and click on a trigger of ComboBox in another column - we have no fix on this case) .

    Please update from SVN and re-test.

    Regarding the checkbox aligning.

    The checkbox in the following column looks center aligned.
    <style type="text/css">
        .x-editor-center {
            padding-left: 3px;
        }
    </style>
    
    <ext:Column
        DataIndex="test" 
        Header="Test"
        Width="37"
        Align="Center">
        <Editor>
          <ext:Checkbox runat="server" Cls="x-editor-center" />
        </Editor>
    </ext:Column>
  5. #5
    Hi Daniil,
    sorry, It is true, I use EditableGrid plugin.
    For the center of column with checkbox ok.
    I have update SVN but: I need two click to change the value of checkbox when I change another checkbox in the same row.
    Explanation:
    I have three checkboxs all checked, I uncheck the first and after I click on the second and it doesn't happen anything so I click another time on the second and check changes.
    Use my example.

    Jimmy
  6. #6
    What browser do you test under? I guess - IE8.
  7. #7
    Hi Daniil,
    I use IE8, version 8.0.6001.18702

    Jimmy
  8. #8
    Please clarify
    <Change Handler="this.onClick();" />
    I should say that EditableGrid "doesn't like" checkbox as editor.

    But here is a workaround: replace
    <Change Handler="this.onClick();" />
    with
    <Check Handler="this.fireEvent('blur', this);" />
  9. #9
    Hi Daniil,
    Now it works fine, you are the best.
    Thank you very mutch.

    Jimmy

Similar Threads

  1. [CLOSED] How to implement GridPanel column resize on double-click?
    By vadym.f in forum 1.x Legacy Premium Help
    Replies: 9
    Last Post: Feb 15, 2013, 6:21 AM
  2. Replies: 2
    Last Post: Aug 04, 2011, 2:14 PM
  3. CheckColumn double click problem
    By Thiago Nogueira in forum 1.x Help
    Replies: 3
    Last Post: Nov 18, 2010, 12:10 PM
  4. Fire cell click on row double-click
    By RPIRES in forum 1.x Help
    Replies: 1
    Last Post: Jul 01, 2010, 8:20 PM
  5. Checkbox Column - Center Edit
    By Tbaseflug in forum 1.x Help
    Replies: 7
    Last Post: Apr 07, 2009, 5:30 AM

Posting Permissions