GridImageColumn On Image Click

2 posts, 1 answers
  1. Allan
    Allan avatar
    121 posts
    Member since:
    Jun 2008

    Posted 10 Jun 2010 Link to this post

    I have a radgrid with a GridImageColumn. I display a thumbnail image in the image column form a data base.  I have set the Grid's onrowdblclick to instantiate some java to popup a radwindow with a larger version of the image.

    Everything works great... EXCEPT, if the user double clicks the actual thumbnail image. Nothing happens. Is there a way to either make the GridImageColumn or the thumbnail image also call the java script like the onrowdblclick event?


     

                            <script type="text/javascript">  
                                function RowClick(sender, eventArgs) {  
                                    var MasterTableView = eventArgs.get_tableView();  
                                    var cell = MasterTableView.getCellByColumnUniqueName(MasterTableView.get_dataItems()[eventArgs.get_itemIndexHierarchical()], "IDImages");  
                                    var oWnd = radopen("../../imagemanager/imagedisplay.aspx?IDImages=" + cell.innerHTML);  
                                }  
            </script>   
                      
                        <telerik:RadGrid ID="rg_VehicleImages" runat="server"   
                            AllowAutomaticDeletes="True" AutoGenerateDeleteColumn="True" CssClass="radgrid"   
                            DataSourceID="sds_ImagesVehicle" GridLines="None" Width="220px">  
                            <mastertableview autogeneratecolumns="False" datakeynames="IDImages"   
                            datasourceid="sds_ImagesVehicle">  
                                <rowindicatorcolumn> 
                                    <HeaderStyle Width="20px" /> 
                                </rowindicatorcolumn> 
                                <expandcollapsecolumn> 
                                    <HeaderStyle Width="20px" /> 
                                </expandcollapsecolumn> 
                                <Columns> 
                                    <telerik:GridBoundColumn DataField="IDimages" DefaultInsertValue=""   
                                        HeaderText="" ItemStyle-ForeColor="White" ItemStyle-Width="2px"   
                                        SortExpression="True">  
                                        <HeaderStyle Width="2px" /> 
                                    </telerik:GridBoundColumn> 
                                    <telerik:GridImageColumn AlternateText="Thumbnail"   
                                        DataImageUrlFields="FilePath, ThumbnailName" DataImageUrlFormatString="{0}/{1}"   
                                        DataType="System.String" FooterText="ImageColumn footer" HeaderText=""   
                                        ImageAlign="Middle">  
                                        <HeaderStyle Width="75px" /> 
                                    </telerik:GridImageColumn> 
                                    <telerik:GridBoundColumn DataField="ThumbnailName" DefaultInsertValue=""   
                                        HeaderText="ThumbnailName" SortExpression="ThumbnailName"   
                                        UniqueName="ThumbnailName" Visible="False">  
                                    </telerik:GridBoundColumn> 
                                </Columns> 
                            </mastertableview> 
                            <clientsettings> 
                                <clientevents onrowdblclick="RowClick"/>  
                            </clientsettings> 
                        </telerik:RadGrid> 



     

  2. Answer
    Tsvetina
    Admin
    Tsvetina avatar
    1876 posts

    Posted 15 Jun 2010 Link to this post

    Hi Allan,

    What you can do is give a UniqueName to the GridImageColumn, wire the ItemCreated event of the Radgrid and attach the ondblclick client event to each image in the grid. See the code snippet below.
    (Let's assume you named your GridImageColumn "Image"):

    protected void RadGrid1_ItemCreated(object sender, GridItemEventArgs e)
        {
            if (e.Item is GridDataItem)
            {
                GridDataItem item = (GridDataItem)e.Item;
                TableCell cell = item["Image"];
                Image img = cell.Controls[0] as Image;
                img.Attributes["ondblclick"] = "onDoubleClick(this, event);";
            }
        }


    Kind regards,
    Tsvetina
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top