mardi 17 février 2015

How to enable options using checkboxes and saving them through local storage?

I started learning jQuery and Javascript not so long ago, and I have encountered some issues with the local storage. I am trying to control select - options using checkboxes, however my code does not work with jQuery 1.11.0, as I used 1.4.4 for this before.


Result expected: When I click on any box, the option linked with it will be enabled and saved in local storage. Also, when I select manually all checkboxes, the select all checkbox will be checked (this works now, but only on first attempt), and when one checkbox is not selected, the select all element will be unchecked automatically. Also, the select/unselect all checkbox does not work as it should.


This is what I had previously http://ift.tt/1DlmCAu, code which worked with 1.4.4 jQuery library, however I would need it to work with 1.11.0 as I have other functions that are in conflict with this old library.


Here's the code I have so far:



$(function enableall_push() {
$(".checkbox2").click(function(){
var b = $(".checkbox2");
if(b.length == b.filter(":checked").length){
$("#enableall_push").attr("checked","checked");
} else {
$("#enableall_push").removeAttr("checked","checked");
}
});

$('#enableall_push').click(function(event) {
if(this.checked) {
$('.checkbox2').each(function() {
this.checked = true;
$('#reasonDrop option[value=101^1]').removeAttr('disabled');
$('#reasonDrop option[value=103^1]').removeAttr('disabled');
$('#reasonDrop option[value=105^1]').removeAttr('disabled');
localStorage.setItem(this.value,'checked');
});
//FUNCTION
} else {
$('.checkbox2').each(function() {
this.checked = false;

$('#reasonDrop option[value=101^1]').attr('disabled','disabled');
$('#reasonDrop option[value=103^1]').attr('disabled','disabled');
$('#reasonDrop option[value=105^1]').attr('disabled','disabled');
localStorage.setItem(this.value,'');
});
//FUNCTION
}
});
});

$(function push101 () {
$("#push1").each(function(){
if (localStorage.getItem(this.value) == 'checked'){
$(this).attr("checked","true");
$('#reasonDrop option[value=101^1]').removeAttr('disabled');
} else {
$('#reasonDrop option[value=101^1]').attr('disabled','disabled');
}
});

$("#push1").click(function(){
if($(this).is(":checked")) {
$('#reasonDrop option[value=101^1]').removeAttr('disabled');
localStorage.setItem(this.value,'checked');
} else {
$('#reasonDrop option[value=101^1]').attr('disabled','disabled');
localStorage.removeItem(this.value);
}
});
});

$(function push103 () {
$("#push2").each(function(){
if (localStorage.getItem(this.value) == 'checked'){
$(this).attr("checked","true");
$('#reasonDrop option[value=103^1]').removeAttr('disabled');
} else {
$('#reasonDrop option[value=103^1]').attr('disabled','disabled');
}
});

$("#push2").click(function(){
if($(this).is(":checked")) {
$('#reasonDrop option[value=103^1]').removeAttr('disabled');
localStorage.setItem(this.value,'checked');
} else {
$('#reasonDrop option[value=103^1]').attr('disabled','disabled');
localStorage.removeItem(this.value);
}
});
});

$(function push105 () {
$("#push3").each(function(){
if (localStorage.getItem(this.value) == 'checked'){
$(this).attr("checked","true");
$('#reasonDrop option[value=105^1]').removeAttr('disabled');
} else {
$('#reasonDrop option[value=105^1]').attr('disabled','disabled');
}
});

$("#push3").click(function(){
if($(this).is(":checked")) {
$('#reasonDrop option[value=105^1]').removeAttr('disabled');
localStorage.setItem(this.value,'checked');
} else {
$('#reasonDrop option[value=105^1]').attr('disabled','disabled');
localStorage.removeItem(this.value);
}
});
});


Thanks!





Aucun commentaire:

Enregistrer un commentaire