working jQuery code won't run in phonegap

Question

Js:

    <script type="text/javascript" src="cordova.js"></script>
    <script type="text/javascript" src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
    <script type="text/javascript" src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.js"></script>

    <script type="text/javascript">
        document.addEventListener("deviceready",onDeviceReady,false);

        function onDeviceReady() {

            document.getElementById("btnSave").addEventListener("click",saveData,false);
            document.getElementById("btnShow").addEventListener("click",showData,false);
}

    function saveData(){
        var data  = window.localStorage.getItem("date");

        var dates = data ? JSON.parse(data) : [];

        dates.push( new Date() );

        window.localStorage.setItem("date", JSON.stringify(dates));

        alert("Your data is stored");
    }

    function showData() {
        var data = JSON.parse(window.localStorage.getItem("date"));
        console.log(data);
        $('#res').html(JSON.stringify(data));
        $(this).html('Update result');
    }

html:

    <button id="btnSave"> Save Data </button>

    <button id="btnShow"> Show Data </button>

Code works in jsfiddle (someone provided it to me) jsfiddle, I've edited it to integrate into phonegap, but the code now won't work when I run it in phonegap (Xcode simulator for iOS).

`won't work` - doesn't give us much to go by - do you have console errors you can share, any clue as to what isn't working would be smashing — Jaromanda X, Sep 18 '16 at 06:13
there's no console errors. When I click Save data, no date gets stored in local storage, the alert "Your data is stored" is not displayed either. — michelle9090, Sep 18 '16 at 06:17
can you confirm that the code in `onDeviceReady` is ever called? — Jaromanda X, Sep 18 '16 at 06:21
yes the code in onDeviceReady should be called as I have other codes in there that gets called without a problem. — michelle9090, Sep 18 '16 at 06:23
I don't think http or https makes a difference? I've tried changing them around and it still won't work. — michelle9090, Sep 18 '16 at 06:25
`I have other codes in there` just not in this example ... does the browser support localStorage? — Jaromanda X, Sep 18 '16 at 06:25
I didn't put those codes in the example because it's not related, the simulator supports localstorage as I can store simple data (the ones that gets overwritten each time) into the localstorage without a problem. — michelle9090, Sep 18 '16 at 06:26
`I don't think http or https makes a difference?` - well, if the page is served https, then in most browsers it will baulk at loading any http content (that's called mixed content) — Jaromanda X, Sep 18 '16 at 06:26
I have tried changing both to http and to https but they didn't affect the outcome — michelle9090, Sep 18 '16 at 06:29
I tried to debug your app on Andorid Studi but dont get any error. try looking at the further link on the post http://stackoverflow.com/questions/15968831/using-local-storage-in-phone-gap — Amir, Sep 18 '16 at 06:51
that link tells you how to first check whether that feature is working on the phone or not. — Amir, Sep 18 '16 at 06:52

Homen · Accepted Answer · 2016-09-18T07:39:00.177

0

Those elements may not be there when your deviceReady fired.So remove those lines from deviceReady and write like following:

$(document).on("click","#btnSave",function(){
    saveData();
});
$(document).on("click","#btnShow",function(){
    showData();
});

And use following jQuery and jQueryMobile

  <script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>

edited Sep 18 '16 at 07:39

answered Sep 18 '16 at 07:10

Homen

1,222
1
12
16

Thanks. I removed the lines from deviceReady and put in yours but it still doesn't work. This is getting so frustrated because I know the code works in normal windows html, but for some reason refuse to work in phonegap – michelle9090 Sep 18 '16 at 07:21
Show your entire `html` page – Homen Sep 18 '16 at 07:25
I think those element should be called, because if I change my js to: function saveData(){ var date= new Date(); window.localStorage.setItem("date", JSON.stringify(date)); alert("Your data is stored"); } so instead of saving multiple values, it overwrites the current date, and this works for me, but again this is not what I want the app to do. – michelle9090 Sep 18 '16 at 07:26
I changed my answer.Check this – Homen Sep 18 '16 at 07:39
after i changed the jQuery and JQueryMobile versions, it gives an error: TypeError: dates.push is not a function. (In 'dates.push( new Date() )', 'dates.push' is undefined) – michelle9090 Sep 18 '16 at 10:23
I just realise an error occurred in web inspector when I click on "Save Data": JSON Parse error: Unexpected identifier "Sat" , pointing to the line: var dates = data ? JSON.parse(data) : []; – michelle9090 Sep 18 '16 at 10:38
It is because your current data is mismatched with previous data.So remove your previous data by history clean .Or use `window.sessionStorage` instead of `window.localStorage`.Then previous data will automatically clear after you close the browser. – Homen Sep 18 '16 at 18:32

working jQuery code won't run in phonegap

1 Answers1