This is a migrated thread and some comments may be shown as answers.

LoadState of Persistencemanager does not work with dynamically created Tiles

7 Answers 228 Views
TileList
This is a migrated thread and some comments may be shown as answers.
Thomas Luck
Top achievements
Rank 1
Thomas Luck asked on 21 Nov 2014, 02:15 PM
Dear Telerik Team

I want to create a page, where the tiles are loaded dynamically from the database. Therefore I added a RadTileList, a RadPersistenceManager and a CustomStorageProvider. When I drag the tiles, the xml will be saved into the database in the correct format. 

After calling the page again the tiles should be shown in the same position. Therefore I use the LoadState() method of the Persistencemanager. The xml string is loaded in the right format and with right information into the RadPersistanceManager. But after rendering the page, only one tile is shown. Although all tiles has been successfully loaded into the RadTileList before.

Thank you for your help
Greetings

Thomas Luck

01.using System;
02.using Telerik.Web.UI;
03. 
04.namespace Isonet.TxpEnterprise.Developer
05.{
06.    public partial class DynamicRadTileList : Page
07.    {
08.        private RadTileListManager myTileManager;
09.        private const int myUserId = 1;
10.        protected void Page_Load(object sender, EventArgs e)
11.        {
12.            uiRadPersistenceManager.StorageProvider = new DbStorageProvider();
13.            myTileManager = new RadTileListManager();
14.            setUi();
15.            if (!IsPostBack)
16.            {
17.                loadViewState();
18.            }
19.        }
20. 
21.        private void setUi()
22.        {
23.            //gets all Tiles
24.            uiRadTileList.Groups.AddRange(myTileManager.GetRadTileGroupList(myUserId));
25.            uiRadTileList.TileRows = 4;
26.        }
27. 
28.        protected void uiIconTileCreateTile_Click(object sender, EventArgs e)
29.        {
30.            uiRadTileList.Groups[0].Tiles.Add(myTileManager.CreateNewTile(uiColorPicker.SelectedColor, myUserId));
31.        }
32. 
33.        private void saveViewState()
34.        {
35.            uiRadPersistenceManager.StorageProviderKey = myUserId.ToString();
36.            uiRadPersistenceManager.SaveState();
37.        }
38. 
39.        private void loadViewState()
40.        {
41.            uiRadPersistenceManager.StorageProviderKey = myUserId.ToString();
42.            uiRadPersistenceManager.LoadState();
43.        }
44. 
45.        protected void OnAjaxRequestHandler(object sender, AjaxRequestEventArgs e)
46.        {
47.            if (e.Argument == "storeTileOrder")
48.            {
49.                saveViewState();
50.            }
51.        }
52.    }
53.}
01.<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="DynamicRadTileList.aspx.cs" Inherits="Isonet.TxpEnterprise.Developer.DynamicRadTileList" %>
02. 
03.<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
04.<!DOCTYPE html>
05. 
07.<head runat="server">
08.    <title></title>
09.</head>
10.<body>
11.    <form id="form1" runat="server">
12.        <telerik:RadAjaxManager ID="uiRadAjaxManager" runat="server" OnAjaxRequest="OnAjaxRequestHandler">
13.        </telerik:RadAjaxManager>
14.        <telerik:RadPersistenceManager runat="server" ID="uiRadPersistenceManager" >
15.            <PersistenceSettings>
16.                <telerik:PersistenceSetting ControlID="uiRadTileList" />
17.            </PersistenceSettings>
18.        </telerik:RadPersistenceManager>
19.        <telerik:RadScriptManager runat="server" ID="RadScriptManager1" EnablePageMethods="True"/>
20.        <div>
21.            <asp:Button ID="create" OnClick="uiIconTileCreateTile_Click" runat="server" Text="Create" />
22.            <telerik:RadColorPicker ID="uiColorPicker" runat="server"></telerik:RadColorPicker>
23.            <telerik:RadTileList  ID="uiRadTileList" runat="server" EnableDragAndDrop="true" OnClientTileDropped="fuu" SelectionMode="Multiple" Width="100%">
24.            </telerik:RadTileList>
25.        </div>
26.    </form>
27.    <script type="text/javascript">
28.               function fuu() {
29.                   var ajaxManager = $find("<%= uiRadAjaxManager.ClientID %>");
30.                   ajaxManager.ajaxRequest("storeTileOrder");;
31.               }
32.    </script>
33.</body>
34.</html>
01.namespace Isonet.TxpEnterprise.Developer
02.{
03.    public class RadTileListManager
04.    {
05.        public List<TileGroup> GetRadTileGroupList(int userId)
06.        {
07.            List<TileGroup> tileGroupList = new List<TileGroup>();
08.            tileGroupList.Add(new TileGroup());
09.            tileGroupList.Add(new TileGroup());
10.            tileGroupList.Add(new TileGroup());
11.            addExistingRadTilesToGroup(tileGroupList[0], userId);
12.            return tileGroupList;
13.        }
14. 
15.        private void addExistingRadTilesToGroup(TileGroup tileGroup, int userId)
16.        {
17.            foreach (DataRow row in ds.Tables[0].Rows)
18.            {
19.                RadTextTile textTile = new RadTextTile();
20.                textTile.BackColor = Color.FromArgb(int.Parse(row.Field<string>("color")));
21.                tileGroup.Tiles.Add(textTile);
22.            }
23.        }
24.    }
25.}

7 Answers, 1 is accepted

Sort by
0
Accepted
Marin Bratanov
Telerik team
answered on 25 Nov 2014, 01:52 PM

Hi Thomas,

Can you try creating the tiles in the Page_Init event as shown in the Persist TileList Settings demo and the Programmatic Creation help article? Also, you must make sure that each time the tiles that are created are the same.

On a side note - for the RadAjaxManager to initiate an AJAX request, it must have some AJAX settings.


Regards,

Marin Bratanov
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
0
Thomas Luck
Top achievements
Rank 1
answered on 26 Nov 2014, 01:51 PM
Hello Marin

Awesome the move into the page_init solved my issue.

Greetings

Thomas Luck
0
Thomas Luck
Top achievements
Rank 1
answered on 26 Nov 2014, 02:10 PM
Dear Marin Bratanov

Now I have another issue. After having some saved tile positions i add some other tiles into the database which are not saved into the xml of the persistencemanager yet. After the LoadState method these will disappear and only the saved tiles are shown in the browser.

This is fine for me because i add them afterwards into the last group so all tiles are shown. But now i have a problem. After saving the positions of the new tiles, the xml is saved correctly into the database. But after reloading the page the tiles are still shown at the last group. It seems like the persistencemanager still removes the new tiles and can't handle the new saved positions.

Is there a mistake I did or is there another way to reach my aim: Something like a custom persistencemanager who reads out the positions manually?

Thank you for your help
Kind Regards

Thomas Luck
0
Thomas Luck
Top achievements
Rank 1
answered on 26 Nov 2014, 02:45 PM
It seems also that the positions of the second group always jump back from
{"tileGroupIndices":[[0,0,0],[0,0,2],[0,0,1],[1,1,2],[1,1,0],[1,1,1],[1,1,3]]
to
{"tileGroupIndices":[[0,0,0],[0,0,2],[0,0,1],[1,1,0],[1,1,1],[1,1,2],[1,1,3]]}.

Greetings

Thomas Luck
0
Marin Bratanov
Telerik team
answered on 28 Nov 2014, 11:37 AM

Hi Thomas,

From what I can gather, this behavior may be expected. The persistence of the tiles heavily relies on the same tiles being created in Page_Init as those who were saved. So, once you add additional tiles, render them on the page, you must save the state again in order for them to be included in the list of persisted tiles.

I am attaching a sample based on our demo (http://demos.telerik.com/aspnet-ajax/tilelist/examples/application-scenarios/persisting-tilelist-settings/defaultcs.aspx)  that shows how recreating all tiles properly lets you load and save their state between page visits. You could use that as base for creating your actual page.

As for creating a custom persister - you can evaluate the json that holds the tiles positions and parse it according to your own logic so you can recreate tiles in a different order in case this helps you (although I am not sure how mere indexes can suffice for this, because the built-in one relies on other private properties). You can download our source code from your account in order to examine how the built-in persistence is implemented if you like to create a customized solution on top of it.


Regards,

Marin Bratanov
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
0
Thomas Luck
Top achievements
Rank 1
answered on 11 Dec 2014, 09:23 AM
Dear Marin Bratanov

 

This didn't really help much. I've made
a workaround now, where I inserted a new added tile manually into the xml at
the last position. But now I still have another issue. After clicking a button,
the persistence manager again breaks: When I click a button the page refreshes
but one tile less than exists is shown. When I reload the page it works,
although I insert the same tiles in the same order with the same state xml.

 

I think all my issues have to do with one
issue. If you use the method GetAllTiles() or even debug through groups and
watch how many tiles are in there, after using the LoadState() method, you
always get one tile less than exists. This issue only happens, when I have
different tiles distributed into more than one group.

 

Now after all this time I tried to reach
my aim, I am wondering whether there is a better way to reach it.

My use case:

- I want to have a page with multiple
tiles and groups created out of the database.

- I want the possibility for the user
that he can change the order of groups and tiles and save it.

- I want the possibility, that the user
can add new tiles (from another page) into the database and that they are shown
at the end of the configured tile page, because they haven't been positioned
yet.

 

I thought about a custom persistence
manager, but therefore I need a method or a way where I get the group index of
a tile to save the position for myself.

 

If you would know another solution,
please let me know, so I can reduce the time I have to investigate.

 

Greetings

Thomas Luck
0
Marin Bratanov
Telerik team
answered on 15 Dec 2014, 11:17 AM

Hello Thomas,

As the demo I linked shows, having the exact same tiles created in Page_Init as the ones you load from the PersistenceManager should result in proper behavior. What I suspect happens in your case is that the new tiles only exist in the persistence manager (i.e., database) and are not properly recreated with each postback.

What I can suggest at this point is to consider using stanadalone tiles that you can create programmatically in the Page_Init event according to your data source, and adding them to containers according to the containers you need (i.e., the data you have). You will lose the drag and drop feature of the tileList but persisting the tiles will then only be a matter of storing the new information in the database and creating the tiles as controls, without the need for a persistence manager.


Regards,

Marin Bratanov
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
Tags
TileList
Asked by
Thomas Luck
Top achievements
Rank 1
Answers by
Marin Bratanov
Telerik team
Thomas Luck
Top achievements
Rank 1
Share this question
or