Div içindeki div i silmek
burayı okumadan soru sorma!
Sepet sistemi yapıyorum. bir tane sepet uygulamam var bunu js ile açıyorum.
Ürün adetini değiştirdigimde eklenen div in güncellemesini ve toplam tutarın değişmesini istiyorum.
Bir türlü yapamadım yardımcı olabilirmisiniz?
<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>
Sepete eklediğim listbox:
<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>
Kontrol Ettiğim js dosyası
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
})
})
Daha fazla markdown örneğine buraya tıklayarak ulaşabilirsin!
Soru hatalı mı? 👎
Eğer sorunun kurallara aykırı olduğunu düşünüyorsanız lütfen bize bildirin!
Cevaplar (0)
Henüz kimse cevap yazmadı. İlk cevap yazan sen ol!