v2.5.2
Giriş yap

Select seçildiğinde işlem yapılması

nrtszr
588 defa görüntülendi

Selectbox da verim var bu veriye göre id degeri odemeekran divine hidden field ve yazı yazdırmak istiyorum nasıl yapabilirim?

Yazı :
1 adet aldığınız A Kalemi fiyatı 50 tl
value degerinden adet fiyatını alıp ürün adını select deki urunadi dan alması gerekiyor.

Nasıl yapabilirim?

<div class="alert alert-primary mt-3" role="alert" id="odemeekrani">
</div>

<select class="form-control form-control-sm" onchange="odemegoster()" name="urun1" id="urun1" urunadi="A Kalemi">
<option fiyat="0" value="0">Seçiniz..</option>
<option fiyat="50" value="1">1</option>
<option fiyat="60" value="2">2</option>
<option fiyat="75" value="3">3</option>
<option fiyat="105" value="4">4</option>
</select>

<script>
    $(document).ready(function(){
        odemeekrani.style.display = "none";
    });

    function odemegoster() {
        if (odemeekrani.style.display == "none") {
            odemeekrani.style.display = "";
        }
    }
<script>
isimimcokguzel2
1447 gün önce

Hocam direkt olarak urunadi alınmıyor diye biliyorum data-urunadi daha kullanışlı olur.
Aynı şey fiyatlar içinde geçerli

Daha verimli olması için tüm ürün select lerine urun classı verelim.

<div class="alert alert-primary mt-3" role="alert" id="odemeekrani">
</div>

<select class="form-control form-control-sm urun" name="urun1" id="urun1" data-urunadi="A Kalemi">
    <option data-fiyat="0" value="0">Seçiniz..</option>
    <option data-fiyat="50" value="1">1</option>
    <option data-fiyat="60" value="2">2</option>
    <option data-fiyat="75" value="3">3</option>
    <option data-fiyat="105" value="4">4</option>
</select>

Javascript tarafında rahat edeceğiz böyle yaparsak.


// Tüm ürün classlarını çekiyoruz.
//(Birden fazla ürün olduğunu varsayıyoruz)
[...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;
        
        //ş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);
    })
})