Hello,
I have a RadTileList on my webform with total of 12 tiles in asp.net project and I have set the TileColumns=4 so I get to see 3 rows of tiles but the tiles order goes from Top to Bottom from first row but I would like it to go from Left to Right.
I did see the "RightToLeft" option but that was not what I wanted to do.
I would like the tile numbers 1,2,3,4 to go left to right on the first row then continue 5,6,7,8 in the second row and the likes.
Would it be possible to add such features to set the Tile Direction Vertical/Horizontal?
Thanks
Hello,
I would like to be able to move tiles between two RadTileLists. This may be through drag and drop or through an external button click.
With the latest release of Firefox version 59.0, we are not able to click on tiles in a tilelist and have them navigate to the specified NavigateURL. We verified this even on the demo on the Telerik site: https://demos.telerik.com/aspnet-ajax/tilelist/examples/overview/defaultcs.aspx Workaround <telerik:RadTileList RenderMode="Lightweight" runat="server" ID="RadTileList1" ScrollingMode="None" Width="640px" SelectionMode="Single" EnableDragAndDrop="true"></telerik:RadTileList> <script> var $T = Telerik.Web.UI; $T.RadTileList.prototype._handleClickAfterDragging = function (draggable, args) { var tile = draggable.tile, shouldHandleClick = this.get_enableDragAndDrop() && !this._isTouchEvent(args._domEvent) && draggable._deltaX < 5 && draggable._deltaY < 5; if (shouldHandleClick) { tile.set_dragStarted(false); if (!$telerik.isMobileSafari) { tile._mouseClickHandler(); } draggable._deltaY = 0; draggable._deltaX = 0; } } </script>
Scrolling by touching the white space between the tiles is possible. If you disable selection scrolling can work as expected. Note that for tablets the scrolling container must be an element outside of the tilelist. A workaround that fixes the majority of the issues is available in the attached sample.
The current RadTileList TileGroup item is only settable as text. Is it possible to modify this item to use a LayoutTemplate so that additional items could be added to the TileGroup area?
Would be incredibly handy if we could programmatically set the image to a byte array with the RadImageTile (or I guess RadImageAndTextTile). Right now you can only set it via the ImageURL but we don't want to store the image like that, we want to read the image from the DB, so we're reading it out as a byte array. This is possible in your RadBinaryImage, I think, but not in the RadImageTile.
A workaround is to have the tile list use the Default skin and change the tiles classes with JavaScript in the OnClientTileDataBound event <asp:ScriptManager ID="Scriptmanager1" runat="server" /> <telerik:RadSkinManager runat="server" ID="rsm1" Skin="mySkinName"></telerik:RadSkinManager> <telerik:RadClientDataSource runat="server" ID="RadClientDataSource1" PageSize="8" AllowPaging="true"> <DataSource> <WebServiceDataSourceSettings BaseUrl="http://demos.kendoui.com/service/"> <Select Url="products" DataType="JSONP" /> </WebServiceDataSourceSettings> </DataSource> </telerik:RadClientDataSource> <telerik:RadTileList ID="rtl" runat="server" RenderMode="Classic" TileRows="3" SelectionMode="Multiple" OnClientTileDataBound="createTile" OnClientTileClicked="tileClicked" EnableEmbeddedSkins="false" Skin="Default" ClientDataSourceID="RadClientDataSource1"> <DataBindings> <CommonTileBinding TileType="RadContentTemplateTile" DataNameField="ProductID" DataTitleTextField="ProductName" DataBadgeValueField="UnitPRice" Shape="Square" /> <ContentTemplateTileBinding> <ClientContentTemplate> <div style="height: 150px; background-image: url('#= ProductName #');"> <div style="padding: 5px 8px 3px 8px;"> <div>#= ProductName #</div> <div style="font-size:0.8em; width: 134px; word-wrap:break-word; padding-bottom: 8px;">#= UnitsInStock #</div> <div class="field pad" > <img src="images/email.png" title="Can be emailed"> </img> </div> <div class="field pad"> <img src="images/SMS.png" title="Can receive SMS"> </img> </div> <div class="field pad"> <img src="images/noentry.png" title="Has a restricted password"> </img> </div> </div> </div> </ClientContentTemplate> </ContentTemplateTileBinding> <ClientTilePeekTemplate> <div style="height: 150px; background-image: url('styles/#= ProductName #/images/large/user.jpg');"> <div style="padding: 5px 8px 5px 8px; width: 134px; height: 140px; background-color: azure;"> <div>#= ProductName #</div> <div class="field" style="font-size:0.8em; width: 100px;">#= ProductID #</div> <div class="field" style="font-size:0.8em; width: 34px; text-align: right;">#= ProductID #</div> <div class="field" style="font-size:0.8em; width: 100px;">#= ProductName #</div> <div class="field" style="font-size:0.8em; width: 34px; text-align: right;">#= ProductName #</div> <div class="field" style="font-size:0.8em; width: 100px;">#= UnitPrice #</div> <div class="field" style="font-size:0.8em; width: 34px; text-align: right;">#= UnitPrice #</div> <div class="field" style="font-size:0.8em; width: 100px;">#= UnitsInStock #</div> <div class="field" style="font-size:0.8em; width: 34px; text-align: right;">#= Discontinued #</div> </div> </div> </ClientTilePeekTemplate> </DataBindings> </telerik:RadTileList> <script> function createTile(sender, args) { var tileElem = $telerik.$(args.get_tile().get_element()); tileElem.removeClass("RadTile_Default").addClass("RadTile_mySkinName"); } function tileClicked() { } </script>
Closed as duplicate of https://feedback.telerik.com/Project/108/Feedback/Details/125717-fix-radlivetile-throws-a-javascript-error-after-being-disposed-in-a-partial-postb
Here is a set of rules to get back the colors div.RadTile_Bootstrap { color: #fff; background-color: #337ab7; } div.RadTile_BlackMetroTouch, div.RadTile_Metro { color: #fff; background-color: #25a0da; } div.RadTile_Office2010Blue { color: #333; background-color: #dbe3ee; } div.RadTile_Office2010Black { color: #fff; background-color: #6f6f6f; } div.RadTile_Office2010Silver { color: #333; background-color: #e2e5e9; } div.RadTile_Outlook { color: #333; background-color: #d6e6f4; } div.RadTile_Silk { color: #fff; background-color: #14afca; } div.RadTile_Simple { color: #333; background-color: #ececec; } div.RadTile_Sunset { color: #333; background-color: #e88d49; } div.RadTile_Telerik { color: #333; background-color: #eee; } div.RadTile_Vista { color: #333; background-color: #eff7fc; } div.RadTile_Web20 { color: #333; background-color: #e7f1ff; } div.RadTile_WebBlue { color: #333; background-color: #5d9fb7; } div.RadTile_Windows7 { color: #1e395b; background-color: #b8cbde; }
If you use the code from the following help article: http://docs.telerik.com/devtools/aspnet-ajax/controls/tilelist/how-to/responsive-layout-and-dynamic-height#responsive-layout-and-dynamic-height and set ScrollingMode property of the RadTileList control to Accelerated after re-sizing the window it is possible to scroll vertically. http://screencast.com/t/KtCjTSAy2558
Hello, Please add support to bind to System.Dynamic.DynamicObject: https://msdn.microsoft.com/en-us/library/system.dynamic.dynamicobject%28v=vs.110%29.aspx?f=255&MSPPError=-2147217396 Regards, Douw
The Click event is not raised at all.
Possible workarounds: - switch to the Classic RenderMode of the TileList: http://docs.telerik.com/devtools/aspnet-ajax/controls/tilelist/mobile-support/render-modes - disable DragAndDrop: http://docs.telerik.com/devtools/aspnet-ajax/controls/tilelist/functionality/drag-and-drop
Until this feature is implemented, you can use the TileDataBound event (http://docs.telerik.com/devtools/aspnet-ajax/controls/tilelist/server-side-programming/events/ontiledatabound) to set properties of the tiles and their child controls.
Sometime it would be better to have a layout that is not in the metro style. Where the default is: 1 2 5 6 3 4 7 8 There are scenarios where: 1 2 3 4 5 6 7 8 would work much better. The tile list fits in metro style apps well but has other uses where that style is not really desired. There has been interest in this for the past couple years in the forum. Thanks Michael