Saving textarea text without an event

Question

I have several textarea tags in my list view. I am saving all the data users type in those textarea when the app is suspended so I can reload it on the next launch. However, the problem is that for me to save the data I have to rely on an event getting fired (e.g. textarea goes out of focus). What do I do in order to stop relying on event and if the user exits the app or the app gets suspended by Windows the text typed in the box is still saved. Is there a way to still get my databinding array to be updated without the event? Here is what is happening right now

Textarea1 = Hello

Textarea2 = Welcome

User launches app and sees the above 2 texts

Now the textareas are edited to

Textarea1 = Sydney

Textarea2 = Australia

Without pressing any button or an event getting fired, the user closes the app and then relaunches it

After relaunch the text areas are not updated and remain

Textarea1 = Hello

Textarea2 = Welcome

Answer 1

Hi

You should save the data to your local.

1 Create a text file in your local.

2 Send update this data every time.

Please refer to this Link below:

http://msdn.microsoft.com/en-us/library/windows/apps/hh465118.aspx

Answer 2

html,body{padding:0;margin:0;font-family:Verdana,Geneva,sans-serif;background:#fff;}html{font-size:100%}body{font-size:.75em;line-height:1.5;padding-top:1px;margin-top:-1px;}h1{font-size:2em;margin:.67em 0}h2{font-size:1.5em}h3{font-size:1.16em}h4{font-size:1em}h5{font-size:.83em}h6{font-size:.7em}p{margin:0 0 1em;padding:0 .2em}.t-marker{display:none;}.t-paste-container{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}ul,ol{padding-left:2.5em}a{color:#00a}code, pre{font-size:1.23em}
Yes I am doing that but I am only able to do that with an event which tells me that something was updated. e.g.

  function renderer(itempromise) {
        return itempromise.then(function (item) {

            varelement = document.createElement("div");
    
            vartext = document.createElement("textarea");
            text .className= "someclass";
            text .innerText= item.data.data;
           
            text.addEventListener("blur", function ()
            {
                //when this event fires, I copy the content of the text area to the item. But how do I do this even without this
                //event. e.g. The blur event might not even get fired as users might just type and exit the app or the app gets suspended on
                //its own. Is there a way to query the text.innerTextbelow outside of this function?
                item.data.data= text.innerText;
                allnotesdata[item.data.noteindex] = text.innerText;
                WinJS.Orry.Utilities.CacheManager.setCache(allnotesdata, function () {
                    console.log('created');

                })
            });
          
            element.appendChild(ta);
            return element;
        
        });
    }

Answer 3

Ok I think I figured it out. Before writing elements to the local file I give them an id and before the app gets suspended I query the text boxes with their id and write the text inside them in the local file. But I am facing another problem while testing the code.

1. Very first run - When the app runs for the very first time (no existing local file present) I have to step through the code below using a breakpoint to create the local file and write data in it. If I do not put a breakpoint the code below does not get executed. A file is created but it is blank with no content. therefore when the app loads and I read the content of the file via JSON.stringify I get an exception. For some reason, the code below only gets executed when there is a breakpoint. What could be the problem?

2. For subsequent times - Once I have created the file and there is content in it, there are no longer any problems in the app. e.g. if I create another text box, write some text in it and close the app - when I relaunch the data is properly written in the file and gets reloaded in an expected way.

What could be the problem here?

 

 app.oncheckpoint = function (args) {
        console.log("suspended");
        // TODO: This application is about to be suspended. Save any state
        // that needs to persist across suspensions here. You might use the
        // WinJS.Application.sessionState object, which is automatically
        // saved and restored across suspension. If you need to complete an
        // asynchronous operation before your application is suspended, call
        // args.setPromise().
       
 for (var j = 0; j < allnotesdata.length; j++)
        {
            //start a loop and query all the text boxes
            var t = document.getElementById("id" + j);

     //transfer their content to an array
            allnotesdata[j] =  t.innerText;       
           
        }
 //after the process above is complete write the data to a local folder.
        WinJS.Orry.Utilities.CacheManager.setCache(allnotesdata, function () {
            console.log('created');

        })
    };

Answer 4

You are executing async functions and not waiting for them to complete.  See the comment in the code you provided:

  // saved and restored across suspension. If you need to complete an
        // asynchronous operation before your application is suspended, call
        // args.setPromise().

To use this you do something like this:

args.setPromise( call asyc function that returns a promise in here);

You have 5 seconds to complete all your code.

-Jeff

---

Jeff Sanders (MSFT)