[CLOSED] How to Hide/Show CommandColumn for Each Row Based on record.data?

  1. #1

    [CLOSED] How to Hide/Show CommandColumn for Each Row Based on record.data?



    I want to hide my delete button in a command column on my GridPanel, based on whether the record.data.Done field is set to 1 or 0 (for that particular row, I don't want to hide the column altogether).

    Anny suggestions as to how to hide the contents of a command column based on record data per row?


    <%@ Page Language="vb"%>
    <%@ Import Namespace="Microsoft.ApplicationBlocks.Data" %>
    <%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
    
    
    <!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 id="Head2" runat="server">
        <title>The Magazine Manager</title>
        
        <script runat="server">                   
            Protected Overloads Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
                Dim cs As String = Helpers.Connection.ConnectionString(Request.ServerVariables("SERVER_NAME"))
                SqlDataSourceInbox.ConnectionString = cs
                            
                'If Not Ext.IsAjaxRequest Then                    
                'End If
            End Sub                     
        </script>
        
        <script type="text/javascript">
    
    
            function handleCommand(command, id) {
                //Ext.Msg.alert('Confirm', command + ' ' + id);
                if (command == 'delete') {
                    Coolite.AjaxMethods.DeleteInboxItem(id);
                }
            }               
        </script>
        
       
    </head>
    <body>
        <form id="form1" runat="server">
        <ext:ScriptManager ID="ScriptManager1" runat="server" ScriptMode="Debug" />            
        <ext:Hidden runat="server" ID="HiddenStatus"></ext:Hidden>
        
         <div class="x-hide-display">
            <ext:DateField ID="FromDateField" runat="server" AllowBlank="true" Width="80"></ext:DateField>
            <ext:DateField ID="ToDateField" runat="server" AllowBlank="true" Width="80"></ext:DateField> 
        
    
        
        <asp:SqlDataSource ID="SqlDataSourceInbox" 
                            runat="server"    
                            SelectCommand="spHomePageInboxGet" 
                            SelectCommandType="StoredProcedure">
            <SelectParameters>       
                <asp:Parameter Name="repid" DefaultValue="188" />
                <asp:Parameter Name="departmentid" DefaultValue="-1" />
                <asp:Parameter Name="fromrepid" DefaultValue="-1" />            
                <asp:Parameter Name="fromdate" DefaultValue="1/1/2009" />   
                <asp:Parameter Name="todate" DefaultValue="3/10/2009" />   
                <asp:Parameter Name="done" DefaultValue="0" />   
                <asp:Parameter Name="inboxtypeids" DefaultValue="3" />            
            </SelectParameters>                      
        </asp:SqlDataSource>
        <ext:Store runat="server" ID="StoreInbox" DataSourceID="SqlDataSourceInbox">
            <Reader>            
                <ext:JsonReader ReaderID="ID">              
                    <Fields>                
                        <ext:RecordField Name="ID" Type="String"/>
                        <ext:RecordField Name="Type" Type="String"/>
                        <ext:RecordField Name="gsCustomersID" Type="Int"/>
                        <ext:RecordField Name="FromName" Type="String" />
                        <ext:RecordField Name="Subject" Type="String" />
                        <ext:RecordField Name="Message" Type="String" />
                        <ext:RecordField Name="DateCreated" Type="Date" />
                        <ext:RecordField Name="Date" Type="String" />
                        <ext:RecordField Name="Time" Type="String" />
                        <ext:RecordField Name="Done" Type="Boolean" />
                        <ext:RecordField Name="Email" Type="String" />
                        <ext:RecordField Name="Phone" Type="String" />
                        <ext:RecordField Name="Address" Type="String" />                    
                        <ext:RecordField Name="MapAddress" Type="String" />  
                    </Fields>            
                </ext:JsonReader>       
            </Reader>   
        </ext:Store>    
                             
        <ext:GridPanel ID="GridPanelInbox" runat="server" 
            StoreID="StoreInbox"
            Height="290" 
            AutoWidth="true" 
            StyleSpec="padding:0px;border:0px;"
             AutoExpandColumn="Subject"
              TrackMouseOver="True"
               AnimCollapse="true" MonitorResize="true" MonitorWindowResize="true" >
                    <TopBar>
                       <ext:Toolbar ID="ToolbarInbox" runat="server">
                        <Items>                                                                                                                                           
                            <ext:ToolbarButton runat="server" ID="ToolbarInboxRefresh" Icon="EmailTransfer">
                                <Listeners>
                                    <Click Handler="#{GridPanelInbox}.reload();" />
                                </Listeners>
                            </ext:ToolbarButton>              
                        </Items>
                    </ext:Toolbar>
                    </TopBar>
                    <ColumnModel>                        
                        <Columns>
                            <ext:CommandColumn Width="1">
                                <Commands>
                                    <ext:GridCommand Icon="Delete" CommandName="delete"></ext:GridCommand> 
                                </Commands>
                            </ext:CommandColumn>        
                            <ext:Column DataIndex="Subject" ColumnID="Subject" Align="Left">
                            </ext:Column>
                            <ext:Column DataIndex="Date" Align="Right"></ext:Column>
                        </Columns>
                    </ColumnModel>    
                    <View>
                        <ext:GridView ID="GridView1" runat="server" EnableRowBody="true" ForceFit="true">
                        </ext:GridView>
                    </View>
    
    
                    <Plugins>
                        <ext:RowExpander ID="RowExpander1" runat="server" Collapsed="false">
                            <Template ID="Template1" runat="server">
                            <tpl>
                                {Message}
                            </tpl>                        
                        </Template>
                    </ext:RowExpander> 
                    </Plugins>
                    
                    <Listeners>
                        <Command Handler="handleCommand(command, record.data.ID);" />
                    </Listeners>
                 </ext:GridPanel>  
                                                                               
        </form>
    </body>
    </html>
  2. #2

    RE: [CLOSED] How to Hide/Show CommandColumn for Each Row Based on record.data?

    Hi,

    You can set PrepareToolbar function:

    <ext:CommandColumn Width="110">
        <Commands>
            <ext:GridCommand Icon="Delete" CommandName="Delete" Text="Delete"></ext:GridCommand>
            <ext:GridCommand Icon="NoteEdit" CommandName="Edit" Text="Edit"></ext:GridCommand>
        </Commands>
    </ext:CommandColumn>
    
    function prepare(grid, toolbar, rowIndex, record) {
    var firstButton = toolbar.items.get(0);
        if (record.data.price < 50) {
            firstButton.setDisabled(true);
            firstButton.setTooltip('Disabled');
        }
    
        //you can return false to cancel toolbar for this record
    }
    Last edited by geoffrey.mcgill; Apr 26, 2016 at 12:53 AM.
  3. #3

    RE: [CLOSED] How to Hide/Show CommandColumn for Each Row Based on record.data?



    Perfect, thank you. I didn't know the command column was derived from the toolbar. Please mark as [solved].

Similar Threads

  1. Replies: 1
    Last Post: Dec 28, 2011, 6:36 PM
  2. Replies: 12
    Last Post: May 05, 2011, 6:21 AM
  3. [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
  4. [CLOSED] Hide GridCommand based on data
    By Justin_Wignall in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Aug 16, 2010, 10:28 AM
  5. [CLOSED] Hide element in grid based on record value
    By rthiney in forum 1.x Legacy Premium Help
    Replies: 6
    Last Post: Mar 25, 2010, 3:39 PM

Posting Permissions