Skip to content Skip to sidebar Skip to footer

Area Calculation With Four Input Fields Using Jquery To Convert Ropani-anna To Sq.ft

I have four input fields.I want to convert ropani ,anna, paisa and dam to sq. ft. I'm unable to convert it .I want to calculate value of four input fields and want to display in an

Solution 1:

There were a few mistakes in the code. Assuming that you want the value in the fifth field on change of any field, please consider the following:

$('input:not(.total)').on('keyup', function() {
  var area = 0;
  var ropani = $(".ropani").val();
  var aana = $(".aana").val();
  var paisa = $(".paisa").val();
  var daam = $(".dam").val();
  area += ropani * 5476.0000;
  area += aana * 342.2500;
  area += paisa * 85.5625;
  // if (parseFloat(daam) < 4) {
  area += daam * 21.390625;
  //s }

  $(".total").val(parseFloat(area));
});
<scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
ropani<inputtype="text"class="ropani" /><br> anna
<inputtype="text"class="aana" /><br> paisa
<inputtype="text"class="paisa" /><br> dam
<inputtype="text"class="dam" /><br> total
<inputtype="text"class="total" /><br>

Changes after @Fallerreaper's suggestions:

var obj = {};
$('input:not(.total)').on('keyup', function(event) {
  var area = 0;
  if (parseFloat(event.target.value) == NaN) return;
  obj[event.target.classList[0]] = event.target.value;
  obj.ropani = obj.ropani ? obj.ropani : $(".ropani").val();
  obj.aana = obj.aana ? obj.aana : $(".aana").val();
  obj.paisa = obj.paisa ? obj.paisa : $(".paisa").val();
  obj.daam = obj.daam ? obj.daam : $(".dam").val();
  area += obj.ropani * 5476.0000 + obj.aana * 342.2500 + obj.paisa * 85.5625 + obj.daam * 21.390625;

  $(".total").val(parseFloat(area));
});
<scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
ropani<inputtype="text"class="ropani" /><br> anna
<inputtype="text"class="aana" /><br> paisa
<inputtype="text"class="paisa" /><br> dam
<inputtype="text"class="dam" /><br> total
<inputtype="text"class="total" /><br>

Solution 2:

Instead of adding change event to the input.ropani. Add keyup event to the all inputs except .total. use .val() to change the value of input.

$("input:not(.total)").on("keyup", function() {
  var area = 0;
  var ropani = +$(".ropani").val() || 0;
  var aana = +$(".aana").val() || 0;
  var paisa = +$(".paisa").val() || 0;
  var dam = +$(".dam").val() || 0;
  area += ropani * 5476.0000;
  area += aana * 342.2500;
  area += paisa * 85.5625;
  area += dam * 21.390625;
  console.log(area); 
  $('.total').val(area);
});
<scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><inputtype="number"class="ropani" /><inputtype="number"class="anna" /><inputtype="number"class="paisa" /><inputtype="number"class="dam" /><inputtype="number"class="total" />

Post a Comment for "Area Calculation With Four Input Fields Using Jquery To Convert Ropani-anna To Sq.ft"