Any option for calculation from select value

Issue

Below code is for showing options for tax and using value for calculation,

<td>
   <select name="taxgroup_id" id="taxgroup_id" class="form-control selectpicker taxgroup_id" data-live-search="true">
   @foreach($taxgroups as $g)
   <option value="{{ $g->taxgroup_id }}" {{$g->taxgroup_is_default ==  1 ? 'selected="selected"': ''}}>{{ $g->taxgroup_name }}</option>
   @endforeach
   </select>
</td>
<td>
 <input readonly type="text" name="bill_item_tax" id="bill_item_tax" class="form-control font-weight-bold bill_item_tax" style="border: 0;" value="">
</td>

I have to store taxgroup_id in DB, so i have given option value as taxgroup_id, but $taxgroups also contains taxgroup_value which need to be used for client-side tax calculation based on option selected,

Is there any solution to do the calculation on taxgroup_value based on option selected taxgroup_id?

otherwise, i need to get value from AJAX and do the calculation, but i want to use that option in last if nothing possible in client side,

Thanks,

Solution

Add the taxgroup_value as a data attribute.

   <option value="{{ $g->taxgroup_id }}" data-taxgroup="{{ $g->taxgroup_value }}" {{$g->taxgroup_is_default ==  1 ? 'selected="selected"': ''}}>{{ $g->taxgroup_name }}</option>

Then when the user selects an option, you can use

$("#taxgroup_id option:selected").data("taxgroup")

to get this value.

Answered By - Barmar