Develop Reference

javascript wont change localstorage value

const checkedStorage = localStorage.getItem("darkMode");
if (checkedStorage === null) {
localStorage.setItem("darkMode", false)
}
function darkMode() {
if (checkedStorage === true) {
localStorage.setItem("darkMode", false)
} else {
localStorage.setItem("darkMode", true)
}
}
When the value is manually set to false and I press the button to run darkMode(), it will change to true but if it is set to true, it won't change to false. When it is set to null it changes to false, which means if it is true and the function is run shouldnt it work? I am honestly stumped. Any help would be great, thanks!

Because when you fetch data from localStorage using localStorage.getItem it returns a string. So "true" === true is false, that's the reason why the value is not being set to false. For more info about getItem please refer here
Please change the condition to like below
function darkMode() {
if (checkedStorage === "true") {
localStorage.setItem("darkMode", false)
} else {
localStorage.setItem("darkMode", true)
}
}
Hope this helps.

You have remember that value in localstorage is a String and isn't boolean. That's you issue. This code will help u
const checkedStorage = localStorage.getItem("darkMode");
if (checkedStorage === null) {
localStorage.setItem("darkMode", false)
}
function darkMode() {
if (checkedStorage === "true") {
localStorage.setItem("darkMode", false)
} else {
localStorage.setItem("darkMode", true)
}
}
darkMode();
I hope help u. Pdta: Sorry for my english.

Why does this function break my form functionality?

I'm trying to figure out why this function does not work when written a certain way but works if I break up the function.
I initially hide sections of a form, and then want to show or hide based on a radio check. These are two different forms on separate pages so I'm wondering if that has something to do with it now working written the first way?
jQuery:
$formMailSelected.hide();
$formEmailSelected.hide();
$formPhoneSelected.hide();
$formEmailSelectedRepresentative.hide();
When written like this it does not work:
$('input:radio[name="howToContact"]').change(function () {
if (this.checked) {
if (this.value === 'Phone' || 'Mail') {
$formPhoneSelected.fadeIn(750);
$formEmailSelectedRepresentative.hide();
$formMailSelected.fadeIn(750);
$formEmailSelected.hide();
} else if (this.value === 'Email') {
$formEmailSelectedRepresentative.fadeIn(750);
$formPhoneSelected.hide();
$formMailSelected.hide();
$formEmailSelected.fadeIn(750);
}
}
});
Broken up and written like this, it DOES work as I would like:
$('input:radio[name="howToContact"]').change(function () {
if (this.checked) {
if (this.value === 'Mail') {
$formMailSelected.fadeIn(750);
$formEmailSelected.hide();
} else if (this.value === 'Email') {
$formMailSelected.hide();
$formEmailSelected.fadeIn(750);
}
}
});
$('input:radio[name="howToContact"]').change(function () {
if (this.checked) {
if (this.value === 'Phone') {
$formPhoneSelected.fadeIn(750);
$formEmailSelectedRepresentative.hide();
} else if (this.value === 'Email') {
$formPhoneSelected.hide();
$formEmailSelectedRepresentative.fadeIn(750);
}
}
});

Polymer 1.0 javascript variable not hitting control statements

I am trying to hide and show certain paper-materials depending on what termiantePlan is. terminatePlan is being passed in from MVC 5 view which is working. Once termiantePlan hits the control statement, its not reading it correctly...the code passes the first if statment because termiantePlan is not null. but once it gets to the second if statement it dosnt read that terminatePlan = "active". Also, If termiantePlan == 'noPlan', i still get this.showTermPlanStatus(terminatedPlan) everytime. I have also tried terminatePlan.indexOf('noPlan') > -1; This doesn't work either.
Polymer({
is: "lithium-terminate-plan",
properties: {
terminatePlan: String
},
observers: [
"termPlan(terminatePlan)"
],
termPlan: function (terminatePlan) {
if (terminatePlan != null || terminatePlan != "active") {
if (terminatePlan == "noPlan") {
this.showTermPlanStatus(noPlanSelected);
} else if (terminatePlan == "error") {
this.showTermPlanStatus(terminatedPlanError);
}
else {
this.showTermPlanStatus(terminatedPlan);
}
} else {
if (this.effectiveDate == null) {
} else {
this.showTermPlanStatus(activePlan);
}
}
},
showTermPlanStatus: function (showTrue) {
this.$.terminatePlanError.hidden = true;
this.$.terminatedPlan.hidden = true;
this.$.noPlanSelected.hidden = true;
this.$.activePlan.hidden = true;
this.$.terminatePlanInProcess.hidden = true;
showTrue.hidden = false;
}
});

How to check the text / label of a button in a PDF Form / Javascript

Tried many variations... none will work :(. Please help!
Note this is for PDF forms (using Adobe Acrobat Pro DC) and I'm adding some javascript in the properties of the button. My main goal is to cycle through 3 button label values (this case isn't shown below... below I'm just showing what I tried in order to check it's current value which I need to do in order to perform the looping).
if (b.label.value == "1") {
b.buttonSetCaption("2");
}
if (b.value.text == "1") {
b.buttonSetCaption("3");
}
if (b.caption.value == "1") {
b.buttonSetCaption("4");
}
if (b.buttonCurrentCaption == "1") {
b.buttonSetCaption("5");
}
if (b.caption == "1") {
b.buttonSetCaption("6");
}
if (b.buttonLabel == "1") {
b.buttonSetCaption("7");
}
if (b.label == "1") {
b.buttonSetCaption("8");
}
if (b.buttonGetLabel == "1") {
b.buttonSetCaption("9");
}
if (b.buttonUpLabel == "1") {
b.buttonSetCaption("10");
}
if (b.value == "1") {
b.buttonSetCaption("11");
}
if (b.buttonValue == "1") {
b.buttonSetCaption("12");
}
if (b.buttonUpStateLabel == "1") {
b.buttonSetCaption("13");
}

I just tried this in my PDF and it seemed to do what you want.
app.alert(b.buttonGetCaption(),1);
This gave me an output of 1 so I think you should be able to do something like this:
if (b.buttonGetCaption() == "1") {
b.buttonSetCaption("2");
}

Toggling a function that depends on a button state?

I'm trying to turn a button-click into a toggle that enables or disables a function, depending on its state. The function allows the enter key to be used for a form submission.
var enterToggle = true;
function enterToggleListener(elem) {
enterKeyPress();
elem.click(function() {
enterToggle = !enterToggle;
console.log('enter-toggle clicked')
if (enterToggle === false) {
console.log('enter toggle false')
// What do I need to add here to stop 'enterKeyPress()'?
} else {
console.log('enter toggle true')
enterKeyPress();
}
});
}
function enterKeyPress() {
$('#noteText').keypress(function(e){
if(e.which == 13){
$('#noteButton').click();
}
});
}
enterToggleListener($('#toggle-button'));
What I don't understand is how to stop the enterKeyPress() function when enterToggle is false. Any suggestions?
EDIT: Cleaned-up code, with #James Montagne's answer added
var enterToggle = true;
function enterToggleListener(elem) {
elem.click(function() {
enterToggle = !enterToggle;
if (enterToggle === false) {
$('#enter-toggle').text('Enter key saves note (OFF)')
} else {
$('#enter-toggle').text('Enter key saves note (ON)')
}
});
}
function enterKeyPress() {
$('#noteText').keypress(function(e){
if(enterToggle && e.which == 13){
$('#noteButton').click();
}
});
}
enterKeyPress();
enterToggleListener($('#enter-toggle'));

function enterKeyPress() {
$('#noteText').keypress(function(e){
if(enterToggle && e.which == 13){
$('#noteButton').click();
}
});
}
You can simply check the value of the variable within your handler. This way you don't need to keep adding and removing the handler as seems to be your current approach.
However, if you must add and remove for some reason, you would use off.