Kendo UI, mydigitalstructure, PhoneGap native on Android

Set out to create a simple HTML5 web app with Kendo UI, then use PhoneGap to port it across to Android to see how difficult the process would be. The answer, not difficult at all which makes sense as it is noted on Kendo's website that PhoneGap and Kendo play nice together, I didn't think it would be this easy though.

First thing I set out to do was to use Kendo UI tabstrip to create a simple HTML5 page where I would use mydigitalstructure to allow a user to login and have the tabs of Actions, Contacts at the bottom of the page and when they switched between each they would be shown the actions or contacts based on a remote source represented in the Kendo UI datasource.

After creating the HTML5 app using Kendo UI mobile I had two html pages, the home page (which contained the login Modal View and a page called apphome which contained the tabstrip items. Both pages contained references to the relevant kendo files and to the master01.js file (this is my javascript that contains the details what GET and POST commands to send to mydigitalstructure).

Beginning to port, I once again followed the information at PhoneGap for Android and fired up Eclipse and built my page and ended up with an index.html swapped in the cordova js file and then started to copy and paste in my header scripts from the HTML5 app, namely kendo.mobile.all.min.css (mobile css for Kendo), 1466site.css (an additional css for my app),  jquery.min.js (a helper js library), kendo.all.min.js (all js for Kendo) and my master01.js.

All went well I created copied across my HTML from the home page and created a new file called apphome.html, since I changed the name of my apphome page I had to change references in the master to read app.navigate("apphome.html"); instead of app.navigate("apphome"); but easy fixes all round.

Then i tested and sent the result to my Android HTC Desire, and the login screen was displayed with the details and basically looked exactly like the HTML5 experience minus the chrome, great stuff, now all going well but after logging in I was encountered with an issue

08-05 11:01:10.932: E/Web Console(19937): Uncaught TypeError: Cannot call method 'replace' of null at file:///android_asset/www/kendo.all.min.js:8

What the hell is this? This appeared in the LogCat logger of items, and since this was the first time I had hit an issue with Eclipse I was truly scratching my head wondering what is going on. My only option was to start commenting out HTML elements to see what is causing the issue. After basically taking the app back to grass roots and slowly building up I suspected the issue was caused whenever I was trying to load content in from the datasource??

Found it finally I had made the simple mistake of not copying across the templates script snippets from the HTML5 app, so Kendo UI was trying to create the listview but had no template as a reference, I added and tried again and everything was fine my contacts and actions would load when each tabstrip option was pressed, very nice, now I have a native app on Android which uses Kendo UI, mydigitalstructure and PhoneGap. 

Now since I am not using any native phone features (location, filesystem, camera etc) that will be my next step to incorporate these features into the app too, also I want to see how I can maintain a session so the user has no need to constantly log in.