[CLOSED] Command's HideMode is not honered during PrepareToolbar (Hiding a Command)

Page 1 of 2 12 LastLast
  1. #1

    [CLOSED] Command's HideMode is not honered during PrepareToolbar (Hiding a Command)

    In the following example, when the command is hidden during PrepareToolbar event, the dimensions of the command are not maintained. It was supposed to maintain the dimensions since the Command's HideMode property is set to 'offsets'

    Click image for larger version. 

Name:	errrrrrrrr00001.jpg 
Views:	31 
Size:	49.0 KB 
ID:	6190

    That's what sencha says about HideMode property: http://docs.sencha.com/extjs/4.1.3/#...t-cfg-hideMode
    'offsets' : The Component will be hidden by absolutely positioning it out of the visible area of the document. This is useful when a hidden Component must maintain measurable dimensions. Hiding using display results in a Component having zero dimensions.
    It's possible tom reproduce the issue by mouse over the 'ODD' rows.
    <!DOCTYPE html>
    <html>
    <head id="Head1" runat="server">
        <script type="text/javascript">
            var prepareToolbar = function (toolbar, record) {
                var command = toolbar.items.get(0);
                if (parseInt(record.raw.id) % 2 == 0) {
                    command.show();
                }
                else {
                    command.hide();
                }
            };
    
        </script>
    </head>
    <body>
        <ext:ResourceManager ID="ResourceManager1" runat="server" />
        <ext:TreePanel ID="_tpnl" RootVisible="false" Title="Ext.Net" HideHeaders="true"
            Height="300" Width="300" Margin="10" runat="server">
            <Store>
                <ext:TreeStore ID="TreeStore1" runat="server">
                    <Proxy>
                        <ext:AjaxProxy Url="/Example/LoadFakeChildren">
                            <ActionMethods Read="POST" />
                            <Reader>
                                <ext:JsonReader Root="data" />
                            </Reader>
                        </ext:AjaxProxy>
                    </Proxy>
                    <Model>
                        <ext:Model ID="Model1" runat="server">
                            <Fields>
                                <ext:ModelField Name="Task" />
                            </Fields>
                        </ext:Model>
                    </Model>
                </ext:TreeStore>
            </Store>
            <Root>
                <ext:Node NodeID="0" Text="Root" />
            </Root>
            <ColumnModel>
                <Columns>
                    <ext:TreeColumn ID="TreeColumn1" Text="Task" DataIndex="Task" Flex="2" runat="server" />
                    <ext:CommandColumn ID="CommandColumn1" OverOnly="True" Width="25" MinWidth="25" MaxWidth="25"
                        runat="server">
                        <Commands>
                            <ext:GridCommand CommandName="abrirAplicacaoComDuplicidade" HideMode="Offsets" Icon="BulletPlus" />
                        </Commands>
                        <PrepareToolbar Handler="prepareToolbar(toolbar, record);" />
                    </ext:CommandColumn>
                </Columns>
            </ColumnModel>
        </ext:TreePanel>
    </body>
    </html>
    namespace SandBox.Controllers
    {
        public class ExampleController : System.Web.Mvc.Controller
        {
            public ActionResult Index()
            {
                return View();
            }
    
            public StoreResult LoadFakeChildren()
            {
                NodeCollection nodes = new NodeCollection(false);
    
                for (int index = 1; index < 6; index++)
                {
                    Node node = new Node
                    {
                        NodeID = index.ToString()
                    };
    
                    node.CustomAttributes.Add(new ConfigItem
                    {
                        Name = "Task",
                        Value = ((index % 2 == 0) ? string.Format("{0} - OK", index) : string.Format("{0} - Fail - Hover me", index)),
                        Mode = ParameterMode.Value
                    });
                    nodes.Add(node);
                }
    
                return new StoreResult
                {
                    Data = nodes.ToJson()
                };
            }
        }
    }
    Last edited by Daniil; Nov 14, 2013 at 4:38 AM. Reason: [CLOSED]
  2. #2
    Maintain component (command button) dimension, not container (toolbar)
    Offset hide mode moves a component out the screen therefore

    You can set fixed toolbar height in prepareToolbar
    toolbar.height = 22;
  3. #3
    Sorry, i forgot to mention ways to overcome this issue.

    It's also possible to overcome this issue by doing the following:
    <style type="text/css">
        .x-grid-componentcolumn .x-grid-cell
        {
            vertical-align: top;
        }
    </style>
    I would like to know whether it's a bug and if it's gonna be 'fixed' internally by Ext.Net.
    Last edited by RCN; May 09, 2013 at 7:18 PM.
  4. #4
    Hi,

    Vladimir meant that a GridCommand's HideMode doesn't affect on a Toolbar itself, i.e. a child's HideMode doesn't affect on a parent's one. So, seems, it is nothing to fix here.

    Could you, please, clarify what exactly we should consider as a bug?
  5. #5
    I just avoid as much as possible setting the value of properties that in my opinion should be controlled internally by the framework. But i accept this workaround since both of you said that there is no problem about setting this property. So, if you have nothing to add, please mark this thread as closed.

    Once again, thank both of you
  6. #6
    After updating from SVN, i found an issue regaring the height of the item when this is selected, as shown below:

    Click image for larger version. 

Name:	Error000001.jpg 
Views:	22 
Size:	48.6 KB 
ID:	6311
  7. #7
    Seems it is OK if set up RowLines="true" for the TreePanel. Could you confirm?
  8. #8
    I am gonna retest. Please wait few minutes
  9. #9
    Daniil, setting RowLines to true changes the control's apperance. Is there any way to overcome this issue without changing the control's appearance?
  10. #10
    Yes, I understand. I just needed a confirmation.

    Please try these CSS rules.
    <style>
        .x-grid-componentcolumn.x-grid-no-row-lines .row-cmd-cell-ct.x-grid-cell-inner {
            padding-top: 1px;
            padding-bottom: 1px;
        }
    
        .x-grid-componentcolumn.x-grid-no-row-lines .x-grid-row-focused .row-cmd-cell-ct.x-grid-cell-inner {
            padding-top: 0px;
            padding-bottom: 0px;
        }
    </style>
Page 1 of 2 12 LastLast

Similar Threads

  1. Grid Command
    By glenh in forum 2.x Help
    Replies: 1
    Last Post: Feb 12, 2013, 6:45 AM
  2. [CLOSED] Command Column
    By RCM in forum 1.x Legacy Premium Help
    Replies: 3
    Last Post: Aug 16, 2012, 4:43 AM
  3. Replies: 9
    Last Post: Apr 25, 2012, 8:03 AM
  4. Row command not working
    By 78fede78 in forum 1.x Help
    Replies: 1
    Last Post: Sep 13, 2010, 10:55 AM
  5. Grid Command
    By marciocxs in forum 1.x Help
    Replies: 1
    Last Post: Apr 14, 2009, 5:27 PM

Posting Permissions