[CLOSED] GridPanel multi-select plus image command

  1. #1

    [CLOSED] GridPanel multi-select plus image command

    https://examples2.ext.net/Examples/G...Image_Command/

    In this example, if you delete multiple rows using shift, and then hit delete, it clears the selection and select only one row. Is it possible to keep the multiple selection so we can apply a command to multiple rows??? We have existing functionality that depends on this.
    Last edited by Daniil; May 06, 2013 at 6:05 AM. Reason: [CLOSED]
  2. #2
    Hello!

    Try the following example:

    <%@ Page Language="C#" %>
    
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    
    <!DOCTYPE html>
    
    <html>
    <head runat="server">
        <title>Group Image Commands - Ext.NET Examples</title>
        <link href="/resources/css/examples.css" rel="stylesheet" />
    
        <script>
            var prepareCommand = function (grid, command, record, row) {
                // you can prepare group command
                if (command.command == 'Delete' && record.data.Price < 5) {
                    command.hidden = true;
                    command.hideMode = 'visibility'; //you can try 'display' also                 
                }
            };
            
            var prepareGroupCommand = function (grid, command, groupId, group) {
                // you can prepare group command
            };
    
            var getAdditionalData = function (data, idx, record, orig) {            
                return {
                    rowBodyColspan : record.fields.getCount(),
                    rowBody: Ext.String.format('<div style=\'padding:0 5px 5px 5px;\'>The {0} [{1}] requires light conditions of <i>{2}</i>.<br /><b>Price: {3}</b></div>', data.Common, data.Botanical, data.Light, Ext.util.Format.usMoney(data.Price))
                };
            };
        </script>
    </head>
    <body>
        <form runat="server">
            <ext:ResourceManager runat="server" SourceFormatting="True" />
            
            <h1>ImageCommandColumn is a simpler and faster version of CommandColumn</h1>
    
            <ext:GridPanel
                runat="server"            
                Collapsible="true" 
                Width="600"             
                Height="350"            
                Title="Plants" 
                Frame="true">
                <Store>
                    <ext:Store runat="server" GroupField="Light">
                        <Proxy>
                            <ext:AjaxProxy Url="../../Shared/PlantService.asmx/Plants">
                                <ActionMethods Read="POST" />
                                <Reader>
                                    <ext:XmlReader Record="Plant" />
                                </Reader>
                            </ext:AjaxProxy>
                        </Proxy>
                        <Model>
                            <ext:Model runat="server">
                                <Fields>
                                    <ext:ModelField Name="Common" />
                                    <ext:ModelField Name="Botanical" />
                                    <ext:ModelField Name="Zone" Type="Int" />
                                    <ext:ModelField Name="ColorCode" />
                                    <ext:ModelField Name="Light" />
                                    <ext:ModelField Name="Price" Type="Float" />
                                    <ext:ModelField Name="Availability" Type="Date" />
                                    <ext:ModelField Name="Indoor" Type="Boolean" />
                                </Fields>
                            </ext:Model>
                        </Model>
                        <Sorters>
                            <ext:DataSorter Property="Common" Direction="ASC"  />
                        </Sorters>
                    </ext:Store>
                </Store>
                <ColumnModel runat="server">
                    <Columns>
                        <ext:Column 
                            runat="server" 
                            Text="Common Name" 
                            DataIndex="Common" 
                            Flex="1" 
                            />
                        <ext:Column 
                            runat="server" 
                            Text="Light" 
                            DataIndex="Light" 
                            Width="130" 
                            />
                        <ext:Column 
                            runat="server" 
                            Text="Price" 
                            DataIndex="Price" 
                            Width="70" 
                            Align="right" 
                            Groupable="false">
                            <Renderer Format="UsMoney" />
                        </ext:Column>
                        <ext:DateColumn 
                            runat="server" 
                            Text="Available" 
                            DataIndex="Availability" 
                            Width="95" 
                            Groupable="false" 
                            Format="yyyy-MM-dd" 
                            />
                        <ext:Column 
                            runat="server" 
                            Text="Indoor?" 
                            DataIndex="Indoor" 
                            Width="55" 
                            />
                        <ext:ImageCommandColumn runat="server" Width="170">
                            <Commands>
                                <ext:ImageCommand CommandName="Delete" Icon="Delete" Text="Delete">
                                    <ToolTip Text="Delete" />
                                </ext:ImageCommand>
                                <ext:ImageCommand CommandName="Edit" Icon="TableEdit" Text="Edit">
                                    <ToolTip Text="Edit" />
                                </ext:ImageCommand>
                                <ext:ImageCommand CommandName="Disabled" Icon="PageWhiteEdit" Text="Disabled" Disabled="true">
                                    <ToolTip Text="Edit" />
                                </ext:ImageCommand>
                            </Commands>
                            
                            <GroupCommands>
                                <ext:GroupImageCommand CommandName="Delete" Icon="Delete" Text="Delete">
                                    <ToolTip Text="Delete" />
                                </ext:GroupImageCommand>
                                <ext:GroupImageCommand CommandName="Edit" Icon="TableEdit" Text="Edit">
                                    <ToolTip Text="Edit" />
                                </ext:GroupImageCommand>
                                <ext:GroupImageCommand CommandName="Chart" Icon="ChartBar" RightAlign="true">
                                    <ToolTip Text="Chart" />
                                </ext:GroupImageCommand>
                            </GroupCommands>
                            
                            <PrepareCommand Fn="prepareCommand" />
                            <PrepareGroupCommand Fn="prepareGroupCommand" />
    
                            <Listeners>
                                <Command Handler="item.grid.selModel.ignoreNextDeselect = item.grid.selModel.getCount(); Ext.Msg.alert(command, record.data.Common);" />
                            </Listeners>
                        </ext:ImageCommandColumn>
                    </Columns>
                </ColumnModel>
                
                <SelectionModel>
                    <ext:RowSelectionModel runat="server" Mode="Multi">
                        <Listeners>
                            <BeforeDeselect Handler="
                                if (item.ignoreNextDeselect == null || item.ignoreNextDeselect <= 0) 
                                    return true; 
                                else { 
                                    --item.ignoreNextDeselect; 
                                    return false; 
                                } "></BeforeDeselect>
                        </Listeners>
                    </ext:RowSelectionModel>
                </SelectionModel>
    
                <View>
                    <ext:GridView runat="server" StripeRows="false" TrackOver="false" />
                </View>
                
                <Features>
                    <ext:Grouping 
                        runat="server" 
                        HideGroupedHeader="true" 
                        GroupHeaderTplString='{columnName}: {name} ({[values.rows.length]} {[values.rows.length > 1 ? "Items" : "Item"]})' 
                        />
    
                    <ext:RowBody runat="server">
                        <GetAdditionalData Fn="getAdditionalData" />
                    </ext:RowBody>
    
                    <ext:RowWrap runat="server" />
                </Features>         
            </ext:GridPanel>
        </form>
    </body>
    </html>
  3. #3
    It is a bug, command should not change a selection, fixed in SVN (in 2.2 branch also)
  4. #4
    Dear @jchau,

    Can you retest this issue with the last sources?
  5. #5
    Quote Originally Posted by Baidaly View Post
    Dear @jchau,

    Can you retest this issue with the last sources?
    Works perfectly with latest 2.2 branch. Thanks for fixing in both branches!

Similar Threads

  1. Command Group Gridpanel select / deselect
    By billy in forum 2.x Help
    Replies: 2
    Last Post: Nov 21, 2012, 9:16 PM
  2. Replies: 1
    Last Post: May 16, 2012, 12:57 PM
  3. [CLOSED] [1.0] - GridPanel - Multi select Question
    By drkoh in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Sep 09, 2010, 8:10 PM
  4. [CLOSED] Is it possible to Select Items of a multi select during ajax event
    By vedagopal2004 in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Jul 29, 2010, 6:28 PM
  5. Multi Select select/deselect
    By Palash in forum 1.x Help
    Replies: 2
    Last Post: Sep 18, 2009, 3:49 AM

Posting Permissions