Saturday, 24 August 2013

Multiple if/else statements in js function for unique input disabling

Multiple if/else statements in js function for unique input disabling

I'm bringing this up because I'm still learning javascript. I'm almost
positive that this is not the correct way to write this function, but it
works. It's ugly as hell, but it works. Just from a look at the script,
can you see an obvious oversight that would have made the code a lot
neater and more semantic?
$('#model').on('change', function(){
var yxs = $('#model').find('option:selected').attr('data-yxs');
var ys = $('#model').find('option:selected').attr('data-ys');
var ym = $('#model').find('option:selected').attr('data-ym');
var yl = $('#model').find('option:selected').attr('data-yl');
var yxl = $('#model').find('option:selected').attr('data-yxl');
var xs = $('#model').find('option:selected').attr('data-xs');
var s = $('#model').find('option:selected').attr('data-s');
var m = $('#model').find('option:selected').attr('data-m');
var l = $('#model').find('option:selected').attr('data-l');
var xl = $('#model').find('option:selected').attr('data-xl');
var xxl = $('#model').find('option:selected').attr('data-xxl');
var xxxl = $('#model').find('option:selected').attr('data-xxxl');
var xxxxl = $('#model').find('option:selected').attr('data-xxxxl');
if (yxs != '') {
$('#yxs').prop('disabled', false);
}
else {
$('#yxs').prop('disabled', true);
}
if (ys != '') {
$('#ys').prop('disabled', false);
}
else {
$('#ys').prop('disabled', true);
}
if (ys != '') {
$('#ym').prop('disabled', false);
}
else {
$('#ym').prop('disabled', true);
}
if (ys != '') {
$('#yl').prop('disabled', false);
}
else {
$('#yl').prop('disabled', true);
}
if (ys != '') {
$('#yxl').prop('disabled', false);
}
else {
$('#yxl').prop('disabled', true);
}
if (ys != '') {
$('#xs').prop('disabled', false);
}
else {
$('#xs').prop('disabled', true);
}
if (ys != '') {
$('#s').prop('disabled', false);
}
else {
$('#s').prop('disabled', true);
}
if (ys != '') {
$('#m').prop('disabled', false);
}
else {
$('#m').prop('disabled', true);
}
if (ys != '') {
$('#l').prop('disabled', false);
}
else {
$('#l').prop('disabled', true);
}
if (ys != '') {
$('#xl').prop('disabled', false);
}
else {
$('#xl').prop('disabled', true);
}
if (ys != '') {
$('#xxl').prop('disabled', false);
}
else {
$('#xxl').prop('disabled', true);
}
if (ys != '') {
$('#xxxl').prop('disabled', false);
}
else {
$('#xxxl').prop('disabled', true);
}
if (ys != '') {
$('#xxxxl').prop('disabled', false);
}
else {
$('#xxxxl').prop('disabled', true);
}
});

No comments:

Post a Comment