JSFiddle - React, Tailwind, and code Playground

by Riccal

HTML

<input type="text" id="default_bolge" value="1" style="display:none;"> marmaris
<br><br>
<input type='radio' name='package[]' id="week1" value='1' style="display:none;" />
<input type='radio' name='package[]' id="week2" value='2' style="display:none;" />
<input type='radio' name='package[]' id="week3" value='3' style="display:none;" /> 

<a href="#" id="1" class="check">week 1 ( 1 USD ) </a>   <br>
<a href="#" id="2" class="check">week 2 ( 2 USD ) </a>   <br>
<a href="#" id="3" class="check">week 3 ( 3 USD ) </a>   <br>


<br><br>
Marmaris > Marmaris = 0 USD<br>
Marmaris > Antalya = 10 USD<br>
Antalya > Marmaris = 10 USD<br>    
Antalya > Antalya = 20 USD<br>    
<select id="bolge">
      <option value="1">Marmaris</option>
      <option value="2">Antalya</option>
</select>

<select id="bolge2">
      <option value="1">Marmaris</option>
      <option value="2">Antalya</option>
</select>

<br><br>
    
<input type="text" name="person" id="person_number" value=""/> Kişi Sayısı
        
        <br><br>
        
<input type="checkbox" name="extra[]" value="2"  view="perbooking" /> Kaptan ( Per Booking = 2 USD ) <br>
<input type="checkbox" name="extra[]" value="3"  view="perbooking" /> Yelken ( Per Booking = 3 USD) <br>
<input type="checkbox" name="extra[]" value="1" view="perday" /> Kaptanss ( Per Day = 1 USD) <br>
<input type="checkbox" name="extra[]" value="1"  view="person" /> Havlu ( Person = 1 USD) <br>
<input type="checkbox" name="extra[]" value="1"  view="perweek" /> Sepet ( Per Week = 1 USD) <br>
    
<br><br>    
<input type="text" name="lastprice" id="lastprice" value="">    Genel Toplam

JavaScript

$(function() {
  

    $('.check').on('click', function () {
        var $this = $(this);
        var id = $this.attr('id');

        $('#week'+id).each(function () {
            if ($(this).is(':checked')) {
                $(this).prop('checked', true);
                 $.fiyatHesapla();  
            } else {
                $(this).prop('checked', true);
                 $.fiyatHesapla();  
            }
        });
     });

    
    $.fiyatHesapla = function(){
         var tier_bolge = [
                { id: 11, Price:0 },
                { id: 12, Price:10 },
                { id: 21, Price:10 },
                { id: 22, Price:20 }
         ];
           
         var fiyat2 = 0;
         var fiyat3;        
         var default_bolge = $('#default_bolge').val()+''+$('#default_bolge').val();
         var bolge_one = $('#bolge').val()        
         var bolge_two = $('#bolge2').val()
         var person_number = $('#person_number').val()
         var bolge = bolge_one+''+bolge_two;    
        
         $('input:checked').each(function(){

             if($(this).attr('view') == 'perday'){ 
               fiyat2 += parseFloat($(this).val() * 7);
             } else if ($(this).attr('view') == 'person'){ 
               fiyat2 += parseFloat($(this).val() * person_number);
             } else if ($(this).attr('view') == 'perbooking'){ 
               fiyat2 += parseFloat($(this).val());
             } else if ($(this).attr('view') == 'perweek'){ 
               fiyat2 += parseFloat($(this).val());
             } else {
               fiyat2 += parseFloat($(this).val());
             }                
         });

          if(default_bolge == bolge){       
                   fiyat3 = 0;
          }else{
                for (var i = 0; i < tier_bolge.length && bolge >= tier_bolge[i].id; i++) {
                    fiyat3 = tier_bolge[i].Price;
                 }
          }    
        
         var fiyat = fiyat2 + fiyat3;
        
        ...