Using RadControls offline (AppCache)

6 posts, 0 answers
  1. Philip
    Philip avatar
    3 posts
    Member since:
    Dec 2013

    Posted 17 Dec 2013 Link to this post

    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?
  2. Alexander
    Alexander avatar
    14 posts
    Member since:
    Oct 2007

    Posted 24 Jun 2014 Link to this post

    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?
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Philip
    Philip avatar
    3 posts
    Member since:
    Dec 2013

    Posted 25 Jun 2014 Link to this post

    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:
    <telerik:RadGrid  ...  EnableEmbeddedBaseStylesheet="false"  EnableEmbeddedSkins="false"  EnableEmbeddedScripts="false">
    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


  5. Jako
    Jako avatar
    107 posts
    Member since:
    Apr 2012

    Posted 20 Nov 2014 Link to this post

    Hello Philip

    Can you maybe refer me to the resource you used to enable your grids and controls to function in offline mode please.

    " things like LocalStorage and IndexedDB"

    Help much appreciated. I saw Kendo UI has offline syncing, how do you enable this on normal telerik radgrids etc.

    Thank you
  6. Jako
    Jako avatar
    107 posts
    Member since:
    Apr 2012

    Posted 20 Nov 2014 Link to this post



    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
  7. Philip
    Philip avatar
    3 posts
    Member since:
    Dec 2013

    Posted 24 Nov 2014 in reply to Jako Link to this post

    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:
    • 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.

Back to Top
UI for ASP.NET Ajax is Ready for VS 2017