Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums JavaScript To-do-list Site issues Re: To-do-list Site issues

#120286
Josh
Participant

>Thanks! Will take a look at the jQuery .on() handler :)

No problem!

>Yea, I did originally use a slightly different checkbox hack, but as I say they all require a label connected to the input with an ID, which will only work for the first to-do, because it’s an ID.

I’m sorry if I’m not understanding this completely, but where are you finding a requirement for an ID on the input? If we’re just focusing on replacing the checkbox graphic here, it’s super simple to do, you don’t even need a class. It would look something like this (a very much simplified piece of code, but you get the idea):

input[type=checkbox] {
opacity: 0; /* Hide the original checkbox */
width: 20px;
}
input[type=checkbox] + label {
cursor: pointer; /* Make sure it looks clickable */
background: url(check.png) left center no-repeat; /* Supply your own custom graphic */
}
input[type=checkbox]:checked + label {
background: url(checked.png); /* Swap out the graphic if the checkbox is :checked */
}

I’ll look through your JS and see if I can locate where it’s clearing the checkboxes for you during my lunch break. I love this kind of thing . . . guess I’m a little OCD. :D