Javascript and HTML5 to do list
I'm trying to get a HTML5 to do list to work. When I add items to the list I should be able to copy past the url to another tab and it should display all the contents on the list but it is not. How do I fix it? This is from a tutorial that I'm following to learn HTML5 and Javascript. Attached is the HTML file. Thank you.
todo-basic.html
todo-basic.html
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Scott Fell
Hey Dave, can you check out this js quandary http:Q_28364025.html
ASKER
Yes I do.
ASKER
What am I missing?
You're never actually calling the "loadToDO" function.
$(document).ready(function
var theList = document.getElementById('t
$('#saveAll').click(functi
e.preventDefault();
localStorage.setItem('todo
});
$('clearAll').click(functi
e.preventDefault();
localStorage.clear();
location.reload();
});
function loadToDo() {
theList.innerHTML = localStorage.getItem('todo
}
loadToDo(); //this is missing from your code
});
$(document).ready(function
var theList = document.getElementById('t
$('#saveAll').click(functi
e.preventDefault();
localStorage.setItem('todo
});
$('clearAll').click(functi
e.preventDefault();
localStorage.clear();
location.reload();
});
function loadToDo() {
theList.innerHTML = localStorage.getItem('todo
}
loadToDo(); //this is missing from your code
});
Snarf's right, but you have some other problems as well. The first time you load your page, or subsequently load after a clear(), your UL will be empty, so you'll never see the Enjoy Life text, and actually have nowhere to type into. You can solve this by adding a simple if statement. If there is no localStorage, drop in a static value.
You also have the ID selector missing from your clearAll() function.
Finally, not really a problem - more of an observation. You're mixing javascript and jquery - not sure why. You also have the javascript:void() calls on your links but they're not needed because you're using e.preventDefault()
Anyway, have a look at this:
You also have the ID selector missing from your clearAll() function.
Finally, not really a problem - more of an observation. You're mixing javascript and jquery - not sure why. You also have the javascript:void() calls on your links but they're not needed because you're using e.preventDefault()
Anyway, have a look at this:
$(document).ready(function() {
var theList = $('#theList');
loadToDo();
$('#saveAll').click(function(e){
e.preventDefault();
localStorage.setItem('todoList', theList.html());
});
$('#clearAll').click(function(e){
e.preventDefault();
localStorage.clear();
location.reload();
});
function loadToDo(){
if (toDoList = localStorage.getItem('todoList')) {
theList.html(toDoList);
} else {
theList.html('<li>Enjoy Life :)</li>');
};
}
});
How is that the answer if you already had the jQuery library in the right place????