Hope you're well! I'm still working on this to-do list site and I'm a little stuck for the best way to track if one of the items has been marked as done, and then how to update the cookie that stores the to-do to only load a checked checkbox.
I've seen things like unload and onbeforeunload which seem like a possible way to go, checking through each checkbox on a page unload then storing the status in the cookie for next time the user visits the page.
But I'm wondering if there are any other suggestions? W3schools thinks onunload doesn't work in Opera or Chome (shockingly!) which would be a definite no-go if that is the case.
haha, I'm working on exactly that idea right now! Great minds!
In a bit of a pickle with it though! I've managed to get it so when a checkbox is checked, it pulls down the cookie for that particular item. But now I need to find just the input element inside that variable. Searching around there doesn't seem to be a way to do this? Ideally I'd just type variableName.getElementsByTagName(input) but the getElementByTagName only works on document. humpf!
@Atelierbram Thanks, That pseudo class has come in handy before, however this is more about changing one part of a JavaScript variable instead of styling something differently. Thanks for the links though! :)
Hmm, so, since you can't search for a tag name within the variable (because the variable is a string, and not part of the DOM), you'd have to do a replace, look for 'input' and replace it with 'input checked="checked"' or something.
Would it be cleaner to modify the DOM, then grab the wrapping element (tr.list-row) to save to the cookie?
Edited to add: Don't forget to also accomodate for situations where the checkbox is checked, then shortly thereafter unchecked, in which case any edits to the element structure will need to be undone.
I was thinking that, instead of pulling the cookie down and trying to edit that, just get all the code from the row and save over the cookie that's already there. Might be a better way to go with less code too maybe.
Hmm, I have the tr element after an onClick I put in the tr. But I can't seem to get anything other than "[object HTMLTableRowElement]", It wont give me the value or the code of the object itself, only seems to tell me what it is :/
Mini update: I was being a bit of an idiot. Managed to get the HTML from inner and outerHTML. Now just need to get this checked status in place and should be golden :)
Hi all!
Hope you're well! I'm still working on this to-do list site and I'm a little stuck for the best way to track if one of the items has been marked as done, and then how to update the cookie that stores the to-do to only load a checked checkbox.
I've seen things like unload and onbeforeunload which seem like a possible way to go, checking through each checkbox on a page unload then storing the status in the cookie for next time the user visits the page.
But I'm wondering if there are any other suggestions? W3schools thinks onunload doesn't work in Opera or Chome (shockingly!) which would be a definite no-go if that is the case.
Thanks guys!
Oh, link to the site if you want to have a mooche around.
[EDIT] This is a vanilla JavaScript project, just as an FYI :)
Just a quick, top-of-the-head idea, but what about this:
-When the checkbox is clicked, fire an event that checks whether it's checked
-If it is, add the "checked" attribute
-Update a variable that writes to the cookie
This should eliminate any need for beforeunload, as it's done in real-time.
:checkedpseudo class in CSS3)[http://www.w3.org/TR/css3-selectors/#checked]haha, I'm working on exactly that idea right now! Great minds!
In a bit of a pickle with it though! I've managed to get it so when a checkbox is checked, it pulls down the cookie for that particular item. But now I need to find just the
inputelement inside that variable. Searching around there doesn't seem to be a way to do this? Ideally I'd just typevariableName.getElementsByTagName(input)but thegetElementByTagNameonly works ondocument.humpf!@Atelierbram Thanks, That pseudo class has come in handy before, however this is more about changing one part of a JavaScript variable instead of styling something differently. Thanks for the links though! :)
Hmm, so, since you can't search for a tag name within the variable (because the variable is a string, and not part of the DOM), you'd have to do a replace, look for 'input' and replace it with 'input checked="checked"' or something.
Would it be cleaner to modify the DOM, then grab the wrapping element (tr.list-row) to save to the cookie?
Edited to add: Don't forget to also accomodate for situations where the checkbox is checked, then shortly thereafter unchecked, in which case any edits to the element structure will need to be undone.
I was thinking that, instead of pulling the cookie down and trying to edit that, just get all the code from the row and save over the cookie that's already there. Might be a better way to go with less code too maybe.
Hmm, I have the
trelement after anonClickI put in thetr. But I can't seem to get anything other than "[object HTMLTableRowElement]", It wont give me the value or the code of the object itself, only seems to tell me what it is :/Mini update: I was being a bit of an idiot. Managed to get the HTML from inner and outerHTML. Now just need to get this checked status in place and should be golden :)