Hello,
I'm working on an application which needs to have an offline portion. We've used RadControls to date for the rest of the site interface. So, we'd like to keep the look and feel as similar as possible for the offline portion.
We aren't doing anything crazy. Just need a couple RadToolBars and RadGrids. We've managed to get everything working including populating grids and controlling toolbars based on data saved in things like LocalStorage and IndexedDB. The only piece left is making the code not dependent on a script that is generated at runtime. When turning on AppCache references to "WebReference.axd?d=..." break because
I have managed to get it completely working by manually caching the numerous "WebReference.axd?d=" files, but I do not like this solution as the file names in the manifest are static.
Is there a better way to do this with RadControls?
I'm working on an application which needs to have an offline portion. We've used RadControls to date for the rest of the site interface. So, we'd like to keep the look and feel as similar as possible for the offline portion.
We aren't doing anything crazy. Just need a couple RadToolBars and RadGrids. We've managed to get everything working including populating grids and controlling toolbars based on data saved in things like LocalStorage and IndexedDB. The only piece left is making the code not dependent on a script that is generated at runtime. When turning on AppCache references to "WebReference.axd?d=..." break because
I have managed to get it completely working by manually caching the numerous "WebReference.axd?d=" files, but I do not like this solution as the file names in the manifest are static.
Is there a better way to do this with RadControls?
4 Answers, 1 is accepted
0
Alexander
Top achievements
Rank 2
Rank 2
answered on 24 Jun 2014, 09:55 PM
Hi
Have you been able to find a solution for this problem? I'm also interested in something similar.
Telerik has just released the RadClientDatasource that is a partial solution for me, but I, as you, need a way to use the radcontrols offline.
Does anyone have a solution for this?
Have you been able to find a solution for this problem? I'm also interested in something similar.
Telerik has just released the RadClientDatasource that is a partial solution for me, but I, as you, need a way to use the radcontrols offline.
Does anyone have a solution for this?
0
Philip
Top achievements
Rank 1
Rank 1
answered on 25 Jun 2014, 01:39 PM
Yeah, I got it working, but it's a very manual process. There's no nice neat solution.
In Controls you'll need to disable various embedded resource options so it will use referenced JavaScript and CSS instead of hitting the server like this:
If you do this to all Rad Controls onteh page you'll notice that your grids and controls are non-functional lacking any styling, so you have to manually reference the CSS and Javascript files. The information to do that for the JS files is here: http://www.telerik.com/help/aspnet-ajax/introduction-disabling-embedded-resources.html it also has a list of which javascript files you'll need for each control.
As for figuring out the CSS files, read up on custom skinning, and jsut include the necessary CSS files. http://www.telerik.com/help/aspnet-ajax/introduction-how-skins-work.html
All files you include this way will need to be listed in your AppCache manifest.
Also, for even if you go through disabling JQuery, there will still be a couple references to WebResources.axd. I haven't been abel to figure out how to get rid of this properly. The best way I found to ID these is with Chrome's Developer Tools. Follow these steps:
Load the page online with the AppCache Manifest so everything gets cached.
Go Offline
Open Developer Tools and go to the "Network" tab.
Anything that shows up in RED text is a file that couldn't be loaded, and thus missing from AppCache manifest.
There might be a few that are still WebResource.axd references. You'll find these links stay pretty much static. The only time I've found it changes is when you update/move the Telerik dlls. Still if you muck about with the DLLs that they reference, (in my case AjaxControlToolkit, and System.Web.Extensions) the links will changed, and updating Telerik might also change them.
Jsut add them to your Manifest and be aware they can change, but it probably won't happen on production unless someone updates a referenced DLL
In Controls you'll need to disable various embedded resource options so it will use referenced JavaScript and CSS instead of hitting the server like this:
<telerik:RadGrid ... EnableEmbeddedBaseStylesheet="false" EnableEmbeddedSkins="false" EnableEmbeddedScripts="false">As for figuring out the CSS files, read up on custom skinning, and jsut include the necessary CSS files. http://www.telerik.com/help/aspnet-ajax/introduction-how-skins-work.html
All files you include this way will need to be listed in your AppCache manifest.
Also, for even if you go through disabling JQuery, there will still be a couple references to WebResources.axd. I haven't been abel to figure out how to get rid of this properly. The best way I found to ID these is with Chrome's Developer Tools. Follow these steps:
Load the page online with the AppCache Manifest so everything gets cached.
Go Offline
Open Developer Tools and go to the "Network" tab.
Anything that shows up in RED text is a file that couldn't be loaded, and thus missing from AppCache manifest.
There might be a few that are still WebResource.axd references. You'll find these links stay pretty much static. The only time I've found it changes is when you update/move the Telerik dlls. Still if you muck about with the DLLs that they reference, (in my case AjaxControlToolkit, and System.Web.Extensions) the links will changed, and updating Telerik might also change them.
Jsut add them to your Manifest and be aware they can change, but it probably won't happen on production unless someone updates a referenced DLL
0
Jako
Top achievements
Rank 1
Rank 1
answered on 20 Nov 2014, 01:07 PM
Hello Philip
Can you please reference me the resource you used to enable offline capabilities.
Help much appreciated. I saw Kendo UI has offline syncing, how do you enable this on normal telerik radgrids etc.
Thank you
0
Philip
Top achievements
Rank 1
Rank 1
answered on 24 Nov 2014, 09:11 PM
Hi Jako,
LocalStorage and IndexedDB are HTML 5 features for storing data on the client.
There's no nice easy way to do this. You'll have to do the research to figure out which would work best in your situation, IndexedDB or LocalStorage (DOM Storage).
Once you make that decision, do some research on the javascript libraries available. They aren't the easiest APIs to use without following a couple good tutorials, so you'll probably want to use someone else's API wrapper. There are probably some easier options by now, but we ended up using ydn.js http://dev.yathit.com/ydn-db/doc/setup/index.html
Basic steps are:
LocalStorage and IndexedDB are HTML 5 features for storing data on the client.
There's no nice easy way to do this. You'll have to do the research to figure out which would work best in your situation, IndexedDB or LocalStorage (DOM Storage).
Once you make that decision, do some research on the javascript libraries available. They aren't the easiest APIs to use without following a couple good tutorials, so you'll probably want to use someone else's API wrapper. There are probably some easier options by now, but we ended up using ydn.js http://dev.yathit.com/ydn-db/doc/setup/index.html
Basic steps are:
- Once online page has loaded make AJAX request to server for data.
- Loop through returned data adding to IndexedDB/LocalStorage
In your offline page, again, after it has finished processing the base page, pull the locally saved data and loop through it to insert rows via the RadGrid Client-Side API. http://www.telerik.com/help/aspnet-ajax/grid-getting-familiar-with-client-side-api.html
I hope that helps.