Passing data between two html pages in phonegap - html

I'm using phonegap to create mobile app.
I don't want to have everything in one html page so I created few of them. Each one has .js file attached. How can I send data between these html pages?

The most portable and simplest way to do it is to use localStorage. There is a bug in Android for passing parameters along in the URL so I don't recommend using that method.

Related

Is there a way to access the HTML of an In App Browser (Themeable Browser)

I am using the ionic framework and would like to be able to read from the HTML from the current webpage and then send the selection back to my application.
I have the Theme-able Browser Plugin setup and can use it like any other web browser.
I have tried looking at ways to include my own script with the .executeScript() function but no luck.
I have also tried to read data from custom buttons that I have inserted into the tool/nav bar but that gives me the HTML of my application.
TL;DR: (Basically want access to the DOM of the current webpage and have the user use native selection to read the document.getSelection() and send that text back to my application.)
Any help would be highly appreciated.
After browsing the forums on Ionic I found the solution:
browser.executeScript({code:'window.getSelection().toString();'}).then((selection)=>{
packet.text = selection[0];});
This allows me to get the selection.

What is the best way to include an external html file into another html file?

When I have one basis html file in which I want to embed a few external html files as sort of a portfolio page, what is the best way to embed those external html files? I now use iframe, but I've read that is not the preferred way? What other options are there and which one is the best?
Most modern websites implement a server-side framework such as php or asp.net that can assemble the final HTML for each page and output it together
The only issue with iFrame is that it causes additional round-trips to the server, as the client has to load each frame individually, but if you don't have access to any server-side scripting then any other solution will do the same thing

Can I still use `.cshtml` files in a hybrid mobile project?

All the resources use only HTML, but stuff like Cordova and Ionic work on the client, with HTML pages (and JavaScript and CSS of course), and once MVC has served a page, that page is HTML, so the hybrid tooling should be able to use it.
The only problem is that once it's served, it lacks the .html extension, but maybe I can figure a way to add this.
The reason I'd like to stick to .cshtml for my layout is that I can scaffold views from my sever-side view models, and this adds quite a lot of value for me.
If the question is: can you have .cshtml files on your mobile device, the answer is no. .cshtml file is processed on server by the Razor view machine, so plain HTML can be generated. Obviously you don't have MVC, Razor and such on your hybrid ionic app.
You can however work around it by taking your angular templates to be generated on your server by MVC. So, when you setup your templateUrl somewhere, instead of taking the relative path to your local template .html file, you can point to the controller on your server, giving the full path, with http:// and so. The controller will then generate your template for you and return as plain HTML.
Bear in mind, that angular will cache this, so it will be loaded only once.

Open new html page inside phonegap app

The thing with phonegap is that it uses it's own API via phonegap.js that is declared at the head of the index.html page.
When using window.open and it's alternatives, the new page will forget anything from the previous one, and phonegap's API would no longer be accessible.
What is the right way to open a new html file?
I really find it hard to believe that phonegap apps have to be one huge html file.
Does your phonegap app need to open a new page? The idea of phonegap is 1-page app. Meaning that to change the view, you don't need to reload the whole DOM tree. Rather you load your DOM only once and then manipulate objects inside it.
You can move to another html page by this code:
window.location = "NewFile.html";

How do i allow the user to select more than one file for upload?

Gmail just released an update to their interface allowing the user to select more than one file for upload by using the CTRL-button. How do they do that? You can read about the new feature and see a screen shot here:
http://gmailblog.blogspot.com/2009/02/updates-to-attachments-multi-select-and.html
You will need to find flash-based sollution, like Google did with Gmail. You can try this jQuery plugin that offers exactly that: jQuery File Upload Plugin
Adobe Flash Player.
Here's a good library that I used: SWFUpload
Of course this is a JavaScript library, and not a jQuery plug-in, making it much more portable.
Take a look at RFC 1867 It defines how to upload files over HTTP using the multipart/mixed encoding. You can use the Apache Commons FileUpload library to do this in Java. I don't know how Google does it, but you can manage the multiple selects with JavaScript processing in your page.
Not the method Gmail uses, but the following link, combined with some jquery you can allow an unlimited number of files to be uploaded at the same time: Link
Google isn't using Flash, but actually some clever javascript (well, that IS what they're all about it seems :-) ). Using javascript and css, you can create a file chooser that lets the user select the file to upload. Then, you use a hidden iframe. The act of posting the form with your upload file targets the hidden iframe so that the result returned from the server on success goes into that hidden iframe. Using javascript, monitor the document body of that iframe to know when the file is uploaded.
This link appears to be a quick example of the basic concept: http://www.seemysites.net/projFolder/uploader/