Hello friends !
I need help please :)
I made a kind of to-do list but based on a game. When you check the box, it "grays" the line. My problem is that when I refresh the page, it keeps the box checked with the API reference code, but on the other hand, the line is back to normal... I think it's because my box is in "hidden" when loading the page. Is there a possibility to also keep the box "grayed out" when the box is checked on refresh?
Below is my site and code.
Thank you in advance for your help.
import {local} from 'wix-storage';
$w.onReady(function () {
$w("#checkbox2").onChange((event) => {
if ($w("#checkbox2").checked) {
$w('#box2').show()
} else {
$w('#box2').hide()
}
})
$w("#checkbox3").onChange((event) => {
if ($w("#checkbox3").checked) {
$w('#box5').show()
} else {
$w('#box5').hide()
}
})
$w("#checkbox4").onChange((event) => {
if ($w("#checkbox4").checked) {
$w('#box7').show()
} else {
$w('#box7').hide()
}
})
$w("#checkbox5").onChange((event) => {
if ($w("#checkbox5").checked) {
$w('#box8').show()
} else {
$w('#box8').hide()
}
})
$w("#checkbox6").onChange((event) => {
if ($w("#checkbox6").checked) {
$w('#box10').show()
} else {
$w('#box10').hide()
}
})
$w("#checkbox7").onChange((event) => {
if ($w("#checkbox7").checked) {
$w('#box12').show()
} else {
$w('#box12').hide()
}
})
$w("#checkbox8").onChange((event) => {
if ($w("#checkbox8").checked) {
$w('#box15').show()
} else {
$w('#box15').hide()
}
})
$w("#checkbox9").onChange((event) => {
if ($w("#checkbox9").checked) {
$w('#box17').show()
} else {
$w('#box17').hide()
}
})
$w("#checkbox10").onChange((event) => {
if ($w("#checkbox10").checked) {
$w('#box19').show()
} else {
$w('#box19').hide()
}
})
$w("#checkbox11").onChange((event) => {
if ($w("#checkbox11").checked) {
$w('#box20').show()
} else {
$w('#box20').hide()
}
})
$w("#checkbox12").onChange((event) => {
if ($w("#checkbox12").checked) {
$w('#box22').show()
} else {
$w('#box22').hide()
}
})
$w("#checkbox13").onChange((event) => {
if ($w("#checkbox13").checked) {
$w('#box24').show()
} else {
$w('#box24').hide()
}
})
});
local.setItem("checkbox", "checked");