Question

I’m making a BMI calculator (see JSFiddle – http://jsfiddle.net/b5ww2/) and I want the height in inches to display in feet and inches. I also want the weight in pounds to be displayed in stones and pounds.

This is the code I’m using to convert the slider value to cm and inches:

slide: function( event, ui ) {
  $( "#heightslidecm" ).html( ui.value + 'cm' );
  $( "#heightslidein" ).html( (ui.value*0.393700787).toFixed(0) + 'in' );
}

My js knowledge isn’t great – especially when it comes to the math aspect.

Any ideas?

Thanks in advance

Answer 1

You simply need to include the logic for the conversion. Here is an example for feet and inches:

slide: function( event, ui ) {
    $( "#heightslidecm" ).html( ui.value + 'cm' );

    var inches = (ui.value*0.393700787).toFixed(0);
    var feet = Math.floor(inches / 12);
    inches %= 12;

    $( "#heightslidein" ).html( feet + "ft " + inches + 'in');
}

You just need to repeat this same logic for the pounds/stone using the appropriate conversion values.