ContextMenu for Tiles

4 posts, 0 answers
  1. Stein
    Stein avatar
    25 posts
    Member since:
    Apr 2008

    Posted 06 Aug 2014 Link to this post

    Is it somehow possible to use the ContextMenu on databound tiles?

    I wish to achieve a dynamic contextmenu that has view, edit, delete (and other) items depending on the tile/item+user.
  2. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 07 Aug 2014 in reply to Stein Link to this post

    Hi Stein,

    Please have a look into the sample code snippet to achieve your scenario.

    ASPX:
    <telerik:RadTileList runat="server" DataSourceID="SqlDataSource1" ID="RadTileList1"
        OnClientTileSelecting="showContxtMenu" SelectionMode="Multiple" AppendDataBoundItems="true"
        Width="1005px" TileRows="4">
        <DataBindings>
            <CommonTileBinding TileType="RadImageAndTextTile" Shape="Square" DataGroupNameField="ContactTitle" />
            <ImageAndTextTileBinding DataTextField="ContactName" />
        </DataBindings>
        <Groups>
            <telerik:TileGroup Name="Sales Manager">
                <telerik:RadContentTemplateTile ID="RadContentTemplateTile1" runat="server" Shape="Square"
                    CssClass="noHover">
                    <ContentTemplate>
                        <div class="groupHeadingTitle">
                            <div class="innerTitle">
                                Sales<br />
                                Managers</div>
                        </div>
                    </ContentTemplate>
                </telerik:RadContentTemplateTile>
            </telerik:TileGroup>
        </Groups>
    </telerik:RadTileList>
    <telerik:RadContextMenu ID="RadContextMenu1" runat="server">
        <Items>
            <telerik:RadMenuItem Text="View">
            </telerik:RadMenuItem>
            <telerik:RadMenuItem Text="Edit">
            </telerik:RadMenuItem>
        </Items>
    </telerik:RadContextMenu>

    JavaScript:
    function showContxtMenu(sender, args) {
        var x = parseInt(args._tile._element.offsetLeft) + 50;
        var y = parseInt(args._tile._element.offsetTop) + 70;
        $find("<%=RadContextMenu1.ClientID%>").showAt(x, y);
        if (args._tile._text == "Palle Ibsen") {
            $find("RadContextMenu1").findItemByText("Edit").hide();
            $find("RadContextMenu1").findItemByText("View").show();
        }
        else {
            $find("RadContextMenu1").findItemByText("Edit").show();
            $find("RadContextMenu1").findItemByText("View").hide();
        }
    }

    Thanks,
    Princy.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Stein
    Stein avatar
    25 posts
    Member since:
    Apr 2008

    Posted 07 Aug 2014 in reply to Princy Link to this post

    Thanks. It's working for the OnClientTileSelecting-event, but I'm selecting the tiles already.
    When I'm changing it to the OnClientTileClicking-event the contextmenu appears correctly, but disappears instantly (and the javascript is giving an error "Cannot read property 'findItemByText' of null", guess since the menu is no longer shown).

    I've added
    args.set_cancel(true);
    , which seems to be the problem mentioned in http://www.telerik.com/forums/open-radwindow-from-radtilelist
    I've also made sure of using the ClickING-event and not the ClickED-event.
    Just tested opening a radwindow on the Clicking-event and that works as expected...


    If I get the context-menu to work, how do I get to handle the contextmenu-clickevents correctly. I need to know which tile's contextmenu that was clicked?




  5. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 08 Aug 2014 in reply to Stein Link to this post

    Hi Stein,

    Unfortunately I couldn't replicate the issue at my end. Please provide your code for further help. As for your next requirement 'args._tile' of the showContxtMenu menu will return the tile, which context menu has shown.  Please elaborate your requirement if it doesn't help. 

    Thanks,
    Princy.
Back to Top