Why does my if else condition not work in jquery?

Question

I am trying to add a condition to some jquery script but for some reason I can't get it to work. I hope someone can tell me what I have got wrong. I want the script to show different text in a div depending on the value of a variable gotten through ajax. Many thanks.

The ajax bit of my script

$(document).ready(function() {

       //Fetch data from server

       $.ajax({
           url: 'my_data.php',
           dataType: "json",
           success: function(data) {

               $("#a").text(data.a);
               $("#b").text(data.b);

               var a = data.a;
               var b = data.b;


               //Condition
               if (a > b) {
                   $("#advice").text("a is greater than b");
               } else {
                   $("#advice").text("b is greater a.");
               }
           }

       });

try to alert(a+' > '+b) before condition statement and what is the result ? — martiendt
– martiendt, Commented Jun 5, 2016 at 17:03
@martiendt that would simply alert a concatenated string. Don't see how that would help — charlietfl
– charlietfl, Commented Jun 5, 2016 at 17:19
I get the alert with the variable values regardless of whether 'a' is greater than 'b' or 'b' greater than 'a'. — JulianJ
– JulianJ, Commented Jun 5, 2016 at 17:21

Elwin Arens · Accepted Answer · 2016-06-05 18:33:38Z

3

try parsing your variable to integer using parseInt(a)

$(document).ready(function() {

   //Fetch data from server

   $.ajax({
       url: 'my_data.php',
       dataType: "json",
       success: function(data) {

           $("#a").text(data.a);
           $("#b").text(data.b);

           var a = parseInt(data.a, 10);
           var b = parseInt(data.b, 10);


           //Condition
           if (a > b) {
               $("#advice").text("a is greater than b");
           } else {
               $("#advice").text("b is greater a.");
           }
       }

   });

edited Jun 5, 2016 at 18:33

Elwin Arens

1,61012 silver badges21 bronze badges

answered Jun 5, 2016 at 17:05

martiendt

2,2261 gold badge22 silver badges28 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Elwin Arens · Accepted Answer · 2016-06-05 19:17:49Z

1

Depending on the data types of data.a and data.b you might get unexpected behaviour if they're not of the type number.

If data.a and data.b are strings, arrays or Object types, using relational operators will result in behaviour that might not be expected, for example:

console.log('19' > '109'); // false
console.log([1,2] > [2,3,4]); // false
console.log({} > {1: 2}); // false

You can convert strings to float using parseFloat(data.a) or int using parseInt(data.a, 10). The 10 is the radix.

To see what the types are of data.a and data.b are use the typeof keyword:

console.log(typeof data.a);
console.log(typeof data.b);

If these aren't Number, then convert them to float or int before using relational operators.

edited Jun 5, 2016 at 19:17

answered Jun 5, 2016 at 17:06

Elwin Arens

1,61012 silver badges21 bronze badges

1 Comment

JulianJ Over a year ago

Thanks for this. They are numbers, I should have said.

Collectives™ on Stack Overflow

Why does my if else condition not work in jquery?

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related