Dinamik değişkenlerin toplamını göster (php ve javascript)

Question

$ Hedef değerlerini (aşağıdaki kodda olduğu gibi) ayarlamak için 2 aralıklı giriş içeren bir formum var. Gönderdiğinizde, form bunları bir veritabanına depolar. Kaydırıcı başına saklanan değerler başlangıçta görüntülenir ancak aralık kaydırıcısı hareket ettikçe javascript yeni seçilen değerleri gösterir.

Artık 2 aralıklı girişi toplam olarak dinamik olarak göstermeye çalışıyorum, yani kayıtlı değerleri temel alarak bir toplamı göstermeye çalışıyorum, ancak bir aralık kaydırıcı taşınırsa, toplam dinamik olarak da değişmelidir.

nasıl fonksiyonları ve karışım ekleyerek php ve javascript değişkenlerin çıkışını eklemek için çalışmak olamaz

, herkes yardımcı olabilir

<label for="monday">Monday - $<span id="monday"><?php echo number_format($set_monday) ?> </span></label> 
<?php if (!empty($set_monday)) { ?> 
<input type="range" min="0" max="5000" id="monday" name="monday" value=<?php echo $set_monday ?> step="100" oninput="showValue1(this.value)" /> 
<?php } else { ?> 
<input type="range" min="0" max="5000" id="monday" name="monday" value="0" step="50" oninput="showValue1(this.value)" /> 
<?php } ?> 
<script type="text/javascript"> function showValue1(newValue) { document.getElementById("monday").innerHTML=newValue;} </script> 


<label for="tuesday">Tuesday - $<span id="tuesday"><?php echo number_format($set_tuesday) ?></span></label> 
<?php if (!empty($set_tuesday)) { ?> 
<input type="range" min="0" max="5000" id="tuesday" name="tuesday" value=<?php echo $set_tuesday ?> step="100" oninput="showValue2(this.value)" /> 
<?php } else { ?> 
<input type="range" min="0" max="5000" id="tuesday" name="tuesday" value="0" step="50" oninput="showValue2(this.value)" /> 
<?php } ?> 
<script type="text/javascript"> function showValue2(newValue) { document.getElementById("tuesday").innerHTML=newValue;} </script> 


<label>Total Target = $ 
<?php 
$sum_total = $set_monday + $set_tuesday; 
echo number_format($sum_total); 
?> 
</label> 

?

Answer 1

Etiketlerin içindeki girişler ve giriş kimlikleri aynıdır, bu yanlıştır. HTML öğelerinin benzersiz kimlikleri olduğundan emin olun. Ayrıca, toplamı dinamik olarak hesaplamak için javascript gereklidir. Buna dayanarak, kod aşağıdaki gibi görünmelidir:

Bilginize

<label for="monday">Monday - $<span id="monday"><?php echo number_format($set_monday) ?> </span></label> 
<?php if (!empty($set_monday)) : ?> 
<input type="range" min="0" max="5000" id="mondayRange" name="monday" value=<?php echo $set_monday ?> step="100" oninput="showValue(this)" /> 
<?php else : ?> 

<input type="range" min="0" max="5000" id="mondayRange" name="monday" value="0" step="50" oninput="showValue(this)" /> 
<?php endif; ?> 

<label for="tuesday">Tuesday - $<span id="tuesday"><?php echo number_format($set_tuesday) ?></span></label><br> 
<?php if (!empty($set_tuesday)) : ?> 
<input type="range" min="0" max="5000" id="tuesdayRange" name="tuesday" value=<?php echo $set_tuesday ?> step="100" oninput="showValue(this)" /> 
<?php else : ?> 
<input type="range" min="0" max="5000" id="tuesdayRange" name="tuesday" value="0" step="50" oninput="showValue(this)" /> 
<?php endif; ?> 


<label id="total">Total Target = $ 
<?php 
$sum_total = $set_monday + $set_tuesday; 
echo number_format($sum_total); 
?> 
</label> 

<script type="text/javascript"> 
    function showValue(range) 
    { 
     var sum = parseInt(document.getElementById('mondayRange').value) + parseInt(document.getElementById('tuesdayRange').value); 

     document.getElementById(range.id.substr(0, range.id.length - 5)).innerHTML = range.value; 
     document.getElementById('total').innerHTML = 'Total Target = $' + sum; 
    } 
</script>