opelhatza
opelhatza

Reputation: 242

How to use session storage in html?

Hello i got 2 html pages. On page one i get the data from sharepoint 2013 with the help of a caml query. I store the values in an collection.

Here is my Javascript:

<script type="text/javascript">

    $(document).ready(function () {
        var scriptbase = "examplebase"
        $.getScript(scriptbase + "SP.Runtime.js", function () {
            $.getScript(scriptbase + "SP.js", doNext);
        });
    });


    var siteUrl = "example.example";


    function doNext() {
        console.log("SharePoint geladen!!");
        retrieveListItems(siteUrl);
    }

    function retrieveListItems(siteUrl) {

    var clientContext = new SP.ClientContext(siteUrl);
    var oList = clientContext.get_web().get_lists().getByTitle('Component Documents');

    var camlQuery = new SP.CamlQuery();
    camlQuery.set_viewXml('<View><ViewFields><FieldRef Name="ComponentID" /><FieldRef Name="FileRef" /><FieldRef Name="ComponentType" /><FieldRef Name="FileLeafRef" /></ViewFields><Query><Where><Eq><FieldRef Name="ComponentCategory" /><Value Type="Text">Datenblatt</Value></Eq></Where></Query></View>');
    this.collListItem = oList.getItems(camlQuery);

    clientContext.load(collListItem);

    clientContext.executeQueryAsync(Function.createDelegate(this, this.onQuerySucceeded), Function.createDelegate(this, this.onQueryFailed));        

}

function onQuerySucceeded(sender, args) {

    var listItemInfo = '';

    var listItemEnumerator = this.collListItem.getEnumerator();

    while (listItemEnumerator.moveNext()) {
        var oListItem = listItemEnumerator.get_current();
        console.log(oListItem);

    }

    sessionStorage.setItem('test', listItemEnumerator );


}



function onQueryFailed(sender, args) {
    alert('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace())
}

</script> 

The above code works on page 1. In the listItemEnumerator collection are 32 objects. Sorry but i am new so i dont now how to say but here from the debugger: [object Object]{$0_0: Object {...}, $2P_0: false, $5_0: Object {...}, $R_0: Object {...}} Hope this helps....

On page 2 i want to populate with the data a new form:

<form id="myForm">
  <select id="selectNumber">
    <option>Choose a number</option>
  </select>

with this Javascript:

<script type="text/javascript">
var myObject = sessionStorage.getItem('test');
for(var i = 0; i < myObject.length; i++) {
    var opt = myObject[i];
    var el = document.createElement("option");
    el.textContent = opt;
    el.value = opt;
    select.appendChild(el);
}
</script>

But somehow the sessionstuff is always undefined no matter what and i have no clue why. Can someone explain me why this dosent work?

Any help would be great and thanks for your time.

BTW sorry for my english

Upvotes: 0

Views: 904

Answers (1)

John Mc
John Mc

Reputation: 2933

The setItem method accepts a key and value, both of which must be strings. In your example, you're always using the key "test" but I suspect this is so to allow you to debug.

As per this S.O post, you'll need to serialise the object to a string using something like JSON.

Upvotes: 1

Related Questions