What's New?

[CLOSED] Show Button ONLY in certain case... but in GridPanel

  1. #1
    Jan 21, 2015, 9:03 AM

    [CLOSED] Show Button ONLY in certain case... but in GridPanel

    I need to show a Column in a Gridpanel that shows a TextField in cells that shows a Button only in certain case... only if I press the "1" button.

    In single Form the code run correctly... look here:
    http://forums.ext.net/showthread.php...-certains-case

    But... if I make the code for GridPanel Column, it not works.

    Also the layout and the auto width (flex = 1) not works.

    Can you help me?

    The code:

    <%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<!DOCTYPE html>

<html>
<head runat="server">
    <title></title>

    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!X.IsAjaxRequest)
            {
                this.Store1.DataSource = new object[]
                {
                    new object[] { 1, "1" },
                    new object[] { 2, "2" },
                    new object[] { 3, "3" }
                };

                this.Store1.DataBind();
            }
        }
    </script>

    <script type="text/javascript">
        var keyFn = function (el, e) {
            if (e.button == '48') {
                App.ButtonTest.show();
            }
            else {
                App.ButtonTest.hide();
            }
            return false;
        };
    </script>
</head>
<body>
    <form runat="server">
        <ext:ResourceManager runat="server" ID="ResourceManager1" />

        <ext:GridPanel runat="server" ID="GridPanel1" Width="300">
            <Store>
                <ext:Store ID="Store1" runat="server">
                    <Model>
                        <ext:Model runat="server" ID="Model1">
                            <Fields>
                                <ext:ModelField Name="ID" Type="Int" />
                                <ext:ModelField Name="Name" Type="String" />
                            </Fields>
                        </ext:Model>
                    </Model>
                </ext:Store>
            </Store>
            <ColumnModel runat="server" ID="ColumnModel1">
                <Columns>
                    <ext:Column runat="server" Text="Groups"  >
                        <Columns>
                            <ext:Column runat="server" DataIndex="ID" Width="50" Text="ID" />
                            <ext:ComponentColumn runat="server" DataIndex="Name" Flex="1" Text="Name">
                                <Component>
                                    <ext:TextField runat="server" EnableKeyEvents="true" >
                                        <Listeners>
                                            <KeyPress Fn="keyFn" />
                                        </Listeners>
                                        <RightButtons>
                                            <ext:Button ID="ButtonTest" runat="server" Icon="Add" Hidden="true" />
                                        </RightButtons>
                                    </ext:TextField>
                                </Component>
                            </ext:ComponentColumn>
                        </Columns>
                    </ext:Column>
                </Columns>
            </ColumnModel>
        </ext:GridPanel>
   </form>
</body>
</html>
    Last edited by Daniil; Jan 23, 2015 at 1:54 PM. Reason: [CLOSED]
  2. #2
    Jan 21, 2015, 1:13 PM
    Hi!

    Try this solution. It is not perfect, but it works.

    <%@ 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.Store1.DataSource = new object[]
                {
                    new object[] { 1, "" },
                    new object[] { 2, "" },
                    new object[] { 3, "" }
                };
            this.Store1.DataBind();
        }
    }
</script>

<!DOCTYPE html>

<html>
<head runat="server">
    <style type="text/css">
        .x-grid .row-cmp-cell-ct td {
            position: relative;
            border-left: 1px solid #b5b8c8 !important;
            border-right: 1px solid #b5b8c8 !important;
            vertical-align: middle !important;
        }

        .x-field-buttons-body .x-btn-icon {
            position: absolute;
            top: 2px;
            right: 0;
        }
    </style>

    <script type="text/javascript">
        var keyFn = function (el, e) {
            if (e.button == '48') {
                this.rightButtons[0].show();
            }
            else {
                this.rightButtons[0].hide();
            }
            return false;
        };
    </script>
</head>
<body>
    <form runat="server">
        <ext:ResourceManager ID="ResourceManager1" runat="server" />
        <ext:GridPanel ID="GridPanel1" runat="server" Width="300">
            <Store>
                <ext:Store ID="Store1" runat="server">
                    <Model>
                        <ext:Model runat="server">
                            <Fields>
                                <ext:ModelField Name="ID" Type="Int" />
                                <ext:ModelField Name="Name" Type="String" />
                            </Fields>
                        </ext:Model>
                    </Model>
                </ext:Store>
            </Store>
            <ColumnModel runat="server">
                <Columns>
                    <ext:Column runat="server" DataIndex="ID" Width="30" Text="ID" />
                    <ext:ComponentColumn runat="server" DataIndex="Name" Flex="1" Editor="true" Text="Name">
                        <Component>
                            <ext:TextField runat="server" EnableKeyEvents="true">
                                <Listeners>
                                    <KeyPress Fn="keyFn" />
                                </Listeners>
                                <RightButtons>
                                    <ext:Button runat="server" Icon="Add" Hidden="true" />
                                </RightButtons>
                            </ext:TextField>
                        </Component>
                    </ext:ComponentColumn>
                </Columns>
            </ColumnModel>
        </ext:GridPanel>
    </form>
</body>
</html>
    Last edited by Sergei; Jan 21, 2015 at 1:17 PM.
  3. #3
    Jan 21, 2015, 2:43 PM
    Tnx SERGEI... it works.

    But... I need to use a "Group Columns".
    If I use this ColumnModel definition the Master Column wrong... :(

    Solutions?

                <ColumnModel runat="server">
                <Columns>
                    <ext:Column runat="server" Text="GROUP" >
                        <Columns>
                            <ext:Column runat="server" DataIndex="ID" Width="30" Text="ID" />
                            <ext:ComponentColumn runat="server" DataIndex="Name" Flex="1" Editor="true" Text="Name">
                                <Component>
                                    <ext:TextField runat="server" EnableKeyEvents="true">
                                        <Listeners>
                                            <KeyPress Fn="keyFn" />
                                        </Listeners>
                                        <RightButtons>
                                            <ext:Button runat="server" Icon="Add" Hidden="true" />
                                        </RightButtons>
                                    </ext:TextField>
                                </Component>
                            </ext:ComponentColumn>
                        </Columns>
                    </ext:Column>
                </Columns>
            </ColumnModel>
  4. #4
    Jan 22, 2015, 1:43 PM
    the Master Column wrong... :(
    Not sure what you mean. Please clarify.
  5. #5
    Jan 23, 2015, 1:35 PM
    Problem solved.
    You can close the thread.

Similar Threads

  1. [CLOSED] Show Button ONLY in certains case
    By Mario in forum 2.x Legacy Premium Help
    Replies: 3
    Last Post: Jan 20, 2015, 3:53 PM
  2. [CLOSED] Need ability to search combobox items by lower case or upper case
    By wisdomchuck in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Jul 23, 2012, 1:40 PM
  3. [CLOSED] RowExpander: GridPanel button doesn't show
    By capecod in forum 1.x Legacy Premium Help
    Replies: 3
    Last Post: Nov 03, 2010, 3:36 PM
  4. [CLOSED] GridPanel sortable: case insensitive
    By RomualdAwessou in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Oct 05, 2010, 2:27 PM
  5. [CLOSED] gridpanel show/ hide header based on toolbar button
    By yobnet in forum 1.x Legacy Premium Help
    Replies: 5
    Last Post: Sep 08, 2010, 12:41 PM

Tags for this Thread

Posting Permissions