<form action="bilgialma.php" method="post">
    <div class="alert alert-primary mt-3" role="alert" id="odemeekrani">
        <div class="row">
            <div class="col border-bottom font-monospace"><small class="text-secondary" title="Ürün"><i class="fas fa-bed"></i> Oda</small></div>
            <div class="col border-bottom font-monospace"><small class="text-secondary" title="Sayı"><i class="fas fa-sort-numeric-up"></i> Sayı</small></div>
            <div class="col border-bottom font-monospace"><small class="text-secondary" title="Fiyat"><i class="fas fa-money-bill"></i> Fiyat</small></div>
        </div>
        <div id="sepet">

        </div>

        <div class="row text-danger" style="font-weight: bold;" id="toplama" name="toplama">
            <div class="col border-top">Toplam</div>
            <div class="col border-top" id="toplam_adet"></div>
            <div class="col border-top" id="toplam_tutar"></div>
        </div>

        <div class="d-grid gap-2 mt-2">
            <button class="btn btn-danger" type="submit">Devam Et</button>
        </div>
    </div>
</form>

                                <select class="form-control form-control-sm urun" onchange="odemegoster()" name="urun<?php echo $i; ?>" id="urun<?php echo $i; ?>" data-urunadi="Oda Adı <?php echo $i; ?> - <i class='small'>İadeli</i>">
                                    <option value="0">Seçiniz..</option>
                                    <option data-fiyat="50" value="1">1</option>
                                    <option data-fiyat="100" value="2">2</option>
                                    <option data-fiyat="150" value="3">3</option>
                                    <option data-fiyat="200" value="4">4</option>
                                    <option data-fiyat="250" value="5">5</option>
                                    <option data-fiyat="300" value="6">6</option>
                                    <option data-fiyat="350" value="7">7</option>
                                    <option data-fiyat="400" value="8">8</option>
                                </select>

    document.querySelectorAll("select.urun").forEach(urun => {
        // Eğer Select Değişirse (onChange)
        urun.addEventListener("change", function(e) {
            // data-urunadi nın değerini aldık
            var urunadi = this.dataset.urunadi;
            var urunid = this.name;

            //şimdi seçilmiş olan option un fiyatını ve değerini alıcaz
            var secilmisOption = this.options[this.selectedIndex];

/*            console.log("Ürün => " + urunadi);
            console.log("Fiyat => " + secilmisOption.dataset.fiyat);
            console.log("Kaç Tane Alındı => " + secilmisOption.value);
            console.log("urunid => " + urunid);*/

if(secilmisOption.value>0)
{
    var urunkontrol = document.getElementById('sepet_' + urunid + '');
    if(urunkontrol)
    {
        console.log("var");
        console.log(urunid);
        $( 'sepet_' + urunid + '' ).html('<div class="row font-monospace" name=sepet_'+urunid+' id=sepet_'+urunid+'><div class="col">'+urunadi+'</div><div class="col">'+secilmisOption.value+'</div><div class="col">'+secilmisOption.dataset.fiyat+'</div></div>');
    }
    else
    {
        console.log("yok");
        console.log(urunid);
        $( "#sepet" ).append('<div class="row font-monospace" name=sepet_'+urunid+' id=sepet_'+urunid+'><div class="col">'+urunadi+'</div><div class="col">'+secilmisOption.value+'</div><div class="col">'+secilmisOption.dataset.fiyat+'</div></div>');
    }

    var toplam_adet = $("#toplam_adet").html();
    if (!$.isNumeric(toplam_adet)) {
        //it's numeric
        toplam_adet = 0;
    }
        toplam_adet = parseInt(toplam_adet) + parseInt(secilmisOption.value);
    $( "#toplam_adet" ).html(toplam_adet);

    var toplam_tutar = $("#toplam_tutar").html();
    if (!$.isNumeric(toplam_tutar)) {
        //it's numeric
        toplam_tutar = 0;
    }
    toplam_tutar = parseInt(toplam_tutar) + parseInt(secilmisOption.dataset.fiyat);
    $( "#toplam_tutar" ).html(toplam_tutar);
}
else
{
    console.log("veri silinecek");
        var verisil = document.getElementById('sepet_' + urunid + '');
        //verisil.remove();
    $( "div" ).remove( verisil);
    $( "div" ).remove( "#toplam_adet" );
    $( "div" ).remove( "#toplam_tutar" );
}
            //işlemler Buraya
        })
    })