CODEWITHSUNDEEP
javascriptjquery
BlackRose00101
BlackRose00101

Reputation: 23

Variable not updating properly within if statement - Javascript/Jquery

I'm working on a tool to grade power tools. I'm trying to make it so that when you update a select element, it checks the value of the current option and disables and enables certain elements around it. The problem I'm running into is that my if statement I'm using does not update the value and gets stuck on the default option.

The code I am using:

Html

<select class='form-control garDropdown' id='garDropdown' name='gar'>
<option value='goedgekeurd'>Goedgekeurd</option>
<option value='reparatie'>Na reparatie goedgekeurd</option>
<option value='afgekeurd'>Afgekeurd</option></select>

js

$(document).on('change', '.garDropdown', function(){
var e = document.getElementById("garDropdown");
var y = e.value;
    console.log(y);
    if (y = "goedgekeurd"){
      $('.repverText').prop('disabled', 'disabled');
      $('.afkeurText').prop('disabled', 'disabled');
      $('.toelichtText').prop('disabled', 'disabled');
      $('.ipwText').prop('disabled', 'disabled');
      console.log(y)
    } else if (y = "reparatie") {
      $('.repverText').prop('disabled', 'disabled');
      $('.afkeurText').prop('disabled', 'disabled');
      $('.toelichtText').prop('disabled', false);
      $('.ipwText').prop('disabled', 'disabled');
      console.log(y)
    } else if (y = "afgekeurd"){
      $('.repverText').prop('disabled', false);
      $('.afkeurText').prop('disabled', false);
      $('.toelichtText').prop('disabled', false);
      $('.ipwText').prop('disabled', 'disabled');
      console.log(y)
}
});

The initial console.log(y) prints the correct value but the console.log(y) within the statement constantly prints 'goedgekeurd'. What am I looking past and is this even possible in this format or am I completely f***ing this up in the first place?

Thanks!

EDIT: Forgot a line of JS code

Upvotes: 0

Views: 1546

Answers (3)

Faraz Babakhel
Faraz Babakhel

Reputation: 664

Implementation of if statement is wrong, this is an assignment statement and will always remain true. Always execute if statement

If statement should be like that

if (y == "goedgekeurd"){
//Do something here
}
else if (y == "reparatie") {
//Do something here
}
else if (y == "afgekeurd"){
//Do something here
}

Upvotes: 0

Halfpint
Halfpint

Reputation: 4079

You are currently testing if the assignment of y = "goedgekeurd" is true which it always will be, this assignment will never fail and therefore you will always trigger the first if statement.

You need to use an equality operator opposed to an assignment operator, therefore: if( y == "goedgekeurd" ) would check if the value you passed is the same. Alternatively you could use === to check for the value and type of the object you're comparing, for example 1 == "1" is true but 1 === "1" is false because the left side is an in and the right hand side is a string.

Solution:

$(document).on('change', '.garDropdown', function(){
var e = document.getElementById("garDropdown");
var y = e.value;
console.log(y);
if (y === "goedgekeurd"){
    $('.repverText').prop('disabled', 'disabled');
    $('.afkeurText').prop('disabled', 'disabled');
    $('.toelichtText').prop('disabled', 'disabled');
    $('.ipwText').prop('disabled', 'disabled');
    console.log(y)
} else if (y === "reparatie") {
    $('.repverText').prop('disabled', 'disabled');
    $('.afkeurText').prop('disabled', 'disabled');
    $('.toelichtText').prop('disabled', false);
    $('.ipwText').prop('disabled', 'disabled');
    console.log(y)
} else if (y === "afgekeurd"){
    $('.repverText').prop('disabled', false);
    $('.afkeurText').prop('disabled', false);
    $('.toelichtText').prop('disabled', false);
    $('.ipwText').prop('disabled', 'disabled');
    console.log(y)
}
});

Upvotes: 1

codejockie
codejockie

Reputation: 10864

$(document).on('change', '.garDropdown', function(){
var e = document.getElementById("garDropdown");
var y = e.value;
    console.log(y);
    if (y === "goedgekeurd"){
      $('.repverText').prop('disabled', 'disabled');
      $('.afkeurText').prop('disabled', 'disabled');
      $('.toelichtText').prop('disabled', 'disabled');
      $('.ipwText').prop('disabled', 'disabled');
      console.log(y)
    } else if (y === "reparatie") {
      $('.repverText').prop('disabled', 'disabled');
      $('.afkeurText').prop('disabled', 'disabled');
      $('.toelichtText').prop('disabled', false);
      $('.ipwText').prop('disabled', 'disabled');
      console.log(y)
    } else if (y === "afgekeurd"){
      $('.repverText').prop('disabled', false);
      $('.afkeurText').prop('disabled', false);
      $('.toelichtText').prop('disabled', false);
      $('.ipwText').prop('disabled', 'disabled');
      console.log(y)
 }
});

Upvotes: 0

Related Questions