calculate GST in jQuery HTML

user_15571393 0
Viewed 725

I am trying to calculate the CGST/SGST/IGST based on input#input. here I am considering input#gst_rate = 18. actually, I am trying - if the user selects LOCAL then input#gst_rate will be divided into 2 and the value as 9 will show in input#cgst = 9 and input#sgst = 9 and input#igst = 0.

If the user selects INTERSTAE then input#gst_rate will show in input#igst = 18 and input#cgst = 0 and input#sgst = 0.

I am not familiar with javascript and jQuery. Please help me with how I achieve the code.

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select name="gst_type" class="gst_type" id="gst_type">
  <option value="1">LOCAL</option>
  <option value="2">INTERSTATE</option>
</select>

<input type="text" class="form-control  gst_rate" id="gst_rate" value="18">
<br/><br/>
<input type="text" class="form-control  cgst" id="cgst" placeholder="CGST">
<input type="text" class="form-control  sgst" id="sgst" placeholder="SGST">
<input type="text" class="form-control  igst" id="igst" placeholder="IGST">

calculation html jquery javascript
1 Answers

You could study this piece of code which shows the result you are waiting:

// initialize
var init_value = $("#gst_rate").val();
var choice = 2
$("#gst_type").val(choice).trigger("change");
interstate();
display(choice);


function interstate() {
  $("#cgst").val(0);
  $("#sgst").val(0);
  $("#igst").val(init_value);
}
function local() {
  let newvalue = init_value / 2;
  $("#cgst").val(newvalue);
  $("#sgst").val(newvalue);
  $("#igst").val(0);
}

function display(c){
  if(c == 1){
    local();
  }else if(c == 2){
    interstate();
  }
}
$("#gst_rate").on("change", function() {
  init_value = $("#gst_rate").val();
  display(choice);
});

$("#gst_type").on("change", function() {
  choice = $(this).val();
  display(choice);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select name="gst_type" class="gst_type" id="gst_type">
  <option value="1">LOCAL</option>
  <option value="2">INTERSTATE</option>
</select>

<input type="text" class="form-control  gst_rate" id="gst_rate" value="18">
<br/><br/>
<input type="text" class="form-control  cgst" id="cgst" placeholder="CGST">
<input type="text" class="form-control  sgst" id="sgst" placeholder="SGST">
<input type="text" class="form-control  igst" id="igst" placeholder="IGST">

user_73807790
Related