This works perfectly in Chrome and Firefox:
var webStorageSupported = ('localStorage' in window) && window['localStorage'] !== null;
if (webStorageSupported && localStorage.getItem("get_list_center") !== null) {
document.getElementById('mail_listing').innerHTML = localStorage.getItem("get_list_center");
}
But I get an unknown exception when I view the page in IE9. I am able to get both the element and the content in the local storage if I type: document.getElementById('mail_listing').innerHTML;
and localStorage.getItem("get_list_center"); separately in console.
When I try to assign the innerHTML as the local storage, unknown exception occurs. What Gives???
Edit: As per suggestion from comment, I've tried to get the local storage in a separate variable then assign that variable inside the innerhtml. It turned out that localstorage was indeed retrieving the HTML formatted code, but it wasn't able to save the whole string:
<table width="100%">......
<TD width=\"7%\" align=right>12K </TD></TR></TBODY></TABLE></DIV>\r\n<DIV style=\"DISPLAY: no
[[CUT OFF FROM HERE]]
I was under the impression that localstorage saves upto 5 MB of text, which is the case for Chrome and Firefox, but maybe this isn't the case for IE9 (Edit: After googling, IE9 supports up to 10MB so clearly it's something else). What can I do to solve this problem?
Edit2: I've verified that localStorage is correctly assigning the entire HTML content if it is retrieved right after the content has been set:
localStorage.setItem('get_list_center', document.body.innerHTML);
var x = localStorage.getItem('get_list_center'); //GETS THE WHOLE HTML CONTENT CORRECTLY.
It's just that when I'm getting the content from somewhere else where I need it from, the content gets cut off. localstorage isn't tampered anywhere else.
