Unexpected result from Javascript function

Question

I'm new at JavaScript, but if anyone can tell me what i missing I would be grateful.

Basically, I'm trying to test the large value from two input. Here is what I have done so far:

$('#than_stock_submit').click(function() {
    var pur_rate = $('#pur_rate input').val(),
        sell_rate = $('#sell_rate input').val(),
        msg_div = $('#sell_rate .msg');

    if(greater_than(sell_rate, pur_rate, msg_div)==false){return false}
});

function greater_than(a, b, msg_div){
    msg_div.show().html( '' );
    if(a > b){
        msg_div.show().html( '<p class="success">Sell Rate is good</p>' );
        return true;
    } else {
        msg_div.show().html( '<p class="error">Sell Rate should be increased</p>' );
        return false;
    }
}

I have checked with several values. When i tested with the value smaller than 1000 and similar both values like b=500 and a=5000 or b=100 and a=1000, then its working. Other values are not working.

Other tested values are:

a=751, b=750 and result=true
a=0751, b=750 and result=false
a=551, b=750 and result=false
a=1051, b=750 and result=false
a=7500, b=750 and result=true
a=6000, b=600 and result=true

I also checked with console like: console.log(a + b);

The results of console window is like 1000750(when value is like a=1000 & b=750) or 0752750(when value is like a=0752 & b=750).

Thanks.

David Hellsing · Accepted Answer · 2012-09-18 14:05:10Z

3

You should convert the strings to numbers before comparing (they become strings when using .val()). Use parseInt or parseFloat:

function greater_than(a, b, msg_div){
    a = parseInt(a, 10);
    b = parseInt(b, 10);
    // etc

answered Sep 18, 2012 at 14:05

David Hellsing

109k44 gold badges181 silver badges214 bronze badges

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

3 Comments

Brad Christie Over a year ago

And links to parseFloat or parseInt (parseInt for whole numbers, parseFloat with numbers that could contain decimal numbers)

itskawsar Over a year ago

but can you tell me, what is for the 10?

David Hellsing Over a year ago

The second argument is radix. JavaScript has some C legacy behaviors, if you pass f.ex parseInt(03) it can interpret this as an octal value in some ECMA versions. Passing 10 as second argument ensures decimal interpretation.

Brad Christie · Accepted Answer · 2012-09-18 14:25:43Z

0

Here's a more robust solution (what you're doing is a string comparison and not a number comparison).

function greater_than(a,b) {
  // first, convert both passed values to numbers
  // (or at least try)
  var nA = new Number(a),
      nB = new Number(b);

  // check if they were converted successfully.
  // isNaN = is Not a Number (invalid input)
  if (!isNan(nA) && !isNaN(nB)) {
    // now go ahead and perform the check
    msg_div.empty().show();
    if (nA > nB) {
      $('<p>',{'class':'success'})
        .text('Sell Rate is good')
        .appendTo(msg_div);
      return true;
    } else {
      $('<p>',{'class':'error'})
        .text('Sell Rate should be increased')
        .appendTo(msg_div);
    }
  }
  // In case you wanted to handle showing an error for
  // invalid input, you can uncomment the following lines
  // and take the necessary action(s)
  else{
    /* one of them was not a number */
  }
  return false;
}

Note that I used jQuery to build the <p> that you add. I also used .empty() instead of assingning .html('').

And some documentation:

answered Sep 18, 2012 at 14:25

Brad Christie

102k16 gold badges160 silver badges200 bronze badges

2 Comments

itskawsar Over a year ago

Great! Thank you very much. Can you tell me why you use $('<p>',{'class':'success'}) .text('Sell Rate is good') .appendTo(msg_div); instead of msg_div.show().html( '<p class="success">Sell Rate is good</p>' ); and .empty() instead of assingning .html('')

Brad Christie Over a year ago

It's much safer to build DOM using the supplied methods than to supply explicit HTML.

Denys Séguret · Accepted Answer · 2012-09-18 14:04:12Z

0

You're comparing strings and "1000">"99" is false.

The solution is to first parse your numbers using parseInt or parseFloat :

 var pur_rate = parseFloat($('#pur_rate input').val());

or

 var pur_rate = parseInt($('#pur_rate input').val(), 10);

answered Sep 18, 2012 at 14:04

Denys Séguret

384k90 gold badges813 silver badges780 bronze badges

Comments

VisioN · Accepted Answer · 2012-09-18 14:12:53Z

0

Reading an input value returns string. So if you compare string to string, it's an ASCII comparison, not a numerical one. Please use parseInt(value, 10); Never forget the radix! ;)

edited Sep 18, 2012 at 14:12

VisioN

146k35 gold badges287 silver badges291 bronze badges

answered Sep 18, 2012 at 14:07

Áxel Costas Pena

6,3256 gold badges33 silver badges63 bronze badges

Collectives™ on Stack Overflow

Unexpected result from Javascript function

4 Answers 4

3 Comments

2 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

3 Comments

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related