[CLOSED] [#408] CellEditing Plugin shows the wrong value in a locked column

  1. #1

    [CLOSED] [#408] CellEditing Plugin shows the wrong value in a locked column

    I have a grid that allows locked columns when I call startEdit() on the editor and pass it the column (locked) and record I want to edit it the editor is in the correct place but the value is being pulled from the unlocked matrix.

    Given the following example:
    <%@ Page Language="C#" %>
    
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    
    
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!X.IsAjaxRequest)
            {
                this.GridPanel1.Store.Primary.DataSource = new object[]
                {
                    new object[] { "3m Co", 71.72, 0.02, 0.03, "9/1 12:00am" },
                    new object[] { "Alcoa Inc", 29.01, 0.42, 1.47, "9/1 12:00am" },
                    new object[] { "Altria Group Inc", 83.81, 0.28, 0.34, "9/1 12:00am" },
                    new object[] { "American Express Company", 52.55, 0.01, 0.02, "9/1 12:00am" },
                    new object[] { "American International Group, Inc.", 64.13, 0.31, 0.49, "9/1 12:00am" },
                    new object[] { "AT&T Inc.", 31.61, -0.48, -1.54, "9/1 12:00am" },
                    new object[] { "Boeing Co.", 75.43, 0.53, 0.71, "9/1 12:00am" },
                    new object[] { "Caterpillar Inc.", 67.27, 0.92, 1.39, "9/1 12:00am" },
                    new object[] { "Citigroup, Inc.", 49.37, 0.02, 0.04, "9/1 12:00am" },
                    new object[] { "E.I. du Pont de Nemours and Company", 40.48, 0.51, 1.28, "9/1 12:00am" },
                    new object[] { "Exxon Mobil Corp", 68.1, -0.43, -0.64, "9/1 12:00am" },
                    new object[] { "General Electric Company", 34.14, -0.08, -0.23, "9/1 12:00am" },
                };
            }
        }
    
    
        [DirectMethod]
        public void SaveComment(string comment)
        {
                DirectResponse responseObject = new DirectResponse();
                System.Threading.Thread.Sleep(10000);
        }
    
    
    </script>
    <!DOCTYPE html>
    <html>
    <head runat="server">
        <title>Locking Column Cell Editing - Ext.NET Examples</title>
        <link href="/resources/css/examples.css" rel="stylesheet" />    
    
    
        <script>
            var addingComment = false;  // semaphore(ish) flag to help prevent confusion when clicking the comments button before the value is set.
            var cellToEdit;
        </script>
        <ext:XScript ID="XScript1" runat="server" EnableViewState="true">
            <script type="text/javascript">
    
    
            var template = '<span style="color:{0};">{1}</span>';
    
    
            var change = function (value) {
                return Ext.String.format(template, (value > 0) ? "green" : "red", value);
            };
    
    
            var pctChange = function (value) {
                return Ext.String.format(template, (value > 0) ? "green" : "red", value + "%");
            };
    
    
    
    
            var CommentTrigger_Click = function (sender, trigger, tag, auto, index) {
                addingComment = true;
                   
                RecordCommentFromUser('Enter a private comment for this grade:');
            };
    
    
            var RecordCommentFromUser = function(promptText){
                addingComment = true;
                var newComment = "";
    
    
                if(#{tableEditer}.activeEditor !== null){
                    cellToEdit = new Array( #{tableEditer}.context.record, #{tableEditer}.context.column);
      //              #{tableEditer}.activeEditor.completeEdit();
                }
    
    
                Ext.Msg.prompt('enter comment',promptText, function(btn, newComment) {
                    if (btn == 'ok') {
                        App.direct.SaveComment(newComment, {
                            success: function(){
                                addingComment = false;
                                #{tableEditer}.startEdit(cellToEdit[0], cellToEdit[1]); // reactivate the editor
                            },
                            failure: function(result){
                                Ext.Msg.alert("Comment change error", "An error was encountered while attempting to save your comment.<br /><B>Please reload the page and try again.</B><br /> Be sure to contact the IT Helpdesk at x2616 if you keep receiving this message.<br /><br /><small>" +  result +"</small>");
                                addingComment = false;
                            }
                        });
                    } else {
                        addingComment = false;
                        #{tableEditer}.startEdit(cellToEdit[0], cellToEdit[1]); // reactivate the editor
                    }
                }, null, true, "" );
            }
    
    
        </script>
            </ext:XScript>
    </head>
    <body>
        <ext:ResourceManager runat="server" />
        <ext:GridPanel 
            ID="GridPanel1"
            runat="server" 
            ColumnLines="true"
            Title="Locking Grid Column" 
            Width="600" 
            Height="350">
            <Store>
                <ext:Store runat="server">
                    <Model>
                        <ext:Model runat="server">
                            <Fields>
                                <ext:ModelField Name="company" />
                                <ext:ModelField Name="price" Type="Float" />
                                <ext:ModelField Name="change" Type="Float" />
                                <ext:ModelField Name="pctChange" Type="Float" />
                                <ext:ModelField Name="lastChange" Type="Date" DateFormat="M/d hh:mmtt" />
                            </Fields>
                        </ext:Model>
                    </Model>
                </ext:Store>
            </Store>
            <ColumnModel>
                <Columns>                
                    <ext:Column 
                        runat="server" 
                        Text="Company<br>Name" 
                        DataIndex="company" 
                        Width="200" 
                        Locked="true" 
                        Sortable="false">
                        <Editor>
                            <ext:TextField runat="server" />
                        </Editor>
                    </ext:Column>
    
    
                    <ext:Column runat="server" Text="Price" DataIndex="price" Width="97" Lockable="false">
                        <Renderer Format="UsMoney" />
                        <Editor>
                            <ext:NumberField runat="server" />
                        </Editor>
                    </ext:Column>
    
    
                    <ext:Column runat="server" Text="Change" DataIndex="change" Width="97" Locked="true">
                        <Renderer Fn="change" />
                        <Editor>
                            <ext:TriggerField runat="server" >
                                <Triggers>
                                    <ext:FieldTrigger Icon="SimpleEdit" />
                                </Triggers>
                                <Listeners>
                                    <TriggerClick Fn="CommentTrigger_Click" />
                                </Listeners>
                            </ext:TriggerField>
                        </Editor>
                    </ext:Column>
    
    
                    <ext:Column runat="server" Text="% Change" DataIndex="pctChange" Width="97">
                        <Renderer Fn="pctChange" />
                        <Editor>
                            <ext:NumberField runat="server" />
                        </Editor>
                    </ext:Column>
    
    
                    <ext:DateColumn runat="server" Text="Last Updated" DataIndex="lastChange" Width="97">
                        <Editor>
                            <ext:DateField runat="server" />
                        </Editor>
                    </ext:DateColumn>
                </Columns>
            </ColumnModel>
            <SelectionModel>
                <ext:CellSelectionModel runat="server" EnableKeyNav="true"  />
            </SelectionModel>
            <Plugins>
                <ext:CellEditing runat="server" ClicksToEdit="1" ID="tableEditer"  />
            </Plugins>
        </ext:GridPanel>          
    </body>
    </html>
    Steps to reproduce:
    1. Click on a cell in the "Change" column (which is locked).
    2. Click on the Trigger button to the right.
    3. Click either "OK" or "Cancel" in the popup (they both demonstrate the issue).
    4. Watch as the editor opens back up but with the data from the "% Change" column of the current row.

    I have found that I can pass in either row and column values or the respective indexes (#{tableEditer}.context.rowIdx, etc) and get the same effect.
    Am I missing something in my call to #{tableEditer}.startEdit or is there a bug here?

    Regards,
    Last edited by Daniil; Dec 27, 2013 at 3:15 AM. Reason: [CLOSED]
  2. #2
    Hello!

    Thank you for the report!

    We are investigating.
  3. #3
    The issue was reported to Sencha.

    We have created an issue to track this defect: https://github.com/extnet/Ext.NET/issues/408
  4. #4
  5. #5
    Quote Originally Posted by Daniil View Post
    I tried that as soon as Baidaly posted the link to the tracker. It does not seem to make any difference in either my application or the example I attached to my original post.

    Regards,
  6. #6
    Sorry, it turned out that it is another issue.

    @scottmartin explains here:
    http://www.sencha.com/forum/showthre...=1#post1019574

    Here is the corrected scripts.
    var CommentTrigger_Click = function (sender, trigger, tag, auto, index) {
        var editingPlugin = this.up("editor").editingPlugin;
                
        addingComment = true;
        RecordCommentFromUser('Enter a private comment for this grade:', editingPlugin);
    };
     
    var RecordCommentFromUser = function(promptText, editingPlugin) {
        var newComment = "";
    
        addingComment = true;
                    
        if (editingPlugin.activeEditor !== null){
            cellToEdit = [ editingPlugin.context.record, editingPlugin.context.column ];
        }
     
        Ext.Msg.prompt('enter comment',promptText, function(btn, newComment) {
            if (btn == 'ok') {
                App.direct.SaveComment(newComment, {
                    success: function(){
                        addingComment = false;
                        editingPlugin.startEdit(cellToEdit[0], cellToEdit[1]); // reactivate the editor
                    },
                    failure: function(result){
                        Ext.Msg.alert("Comment change error", "An error was encountered while attempting to save your comment.<br /><B>Please reload the page and try again.</B><br /> Be sure to contact the IT Helpdesk at x2616 if you keep receiving this message.<br /><br /><small>" +  result +"</small>");
                        addingComment = false;
                    }
                });
            } else {
                addingComment = false;
                editingPlugin.startEdit(cellToEdit[0], cellToEdit[1]); // reactivate the editor
            }
        }, null, true, "" );
    };
  7. #7
    That worked like a charm! I integrated the fix and my editor works wonderfully now.

    Thank-you!

Similar Threads

  1. Replies: 6
    Last Post: Mar 24, 2014, 7:03 AM
  2. Replies: 4
    Last Post: Nov 19, 2013, 1:11 PM
  3. Replies: 6
    Last Post: Jun 20, 2013, 1:25 PM
  4. [CLOSED] CellEditing Plugin tab key
    By softmachine2011 in forum 2.x Legacy Premium Help
    Replies: 14
    Last Post: Jun 05, 2013, 7:03 AM
  5. [CLOSED] CellEditing plugin
    By Kev in forum 2.x Legacy Premium Help
    Replies: 5
    Last Post: Sep 13, 2012, 8:06 PM

Tags for this Thread

Posting Permissions