Javascript - Как изменить новое значение в раскрывающемся списке

Question

Когда мы изменим name="quantity" и значение $product['price'] тоже изменится. Здесь будет динамическое количество и цена. Как это сделать с помощью jquery / javascript.

<?php
$select  = "SELECT * FROM `products` ORDER BY `id` DESC LIMIT 10"; 
$query  = mysql_query($select) or die(mysql_error());
?>

<ul>
  <?php while($product = mysql_fetch_array($query)) { ?>
  <li>
    <p><?php echo $product['name'];?></p>
    <p> Quantity
      <select name="quantity">
        <?php  for($i=1;$i<=$product['quantity'];$i++) { ?>
        <option value="<?php echo $i; ?>"><?php echo $i; ?></option>
        <?php } ?>
      </select>
   </p>
   <p><?php echo $product['price'];?></p>
 </li>
<?php } ?>
</ul>

Дайте мне знать:)

Answer 1

Использование jQuery:

$(document).ready(function() {
    $("#quantity_select").bind("change", function() {
        selected_option = $("option:selected").val();
        $("#counter").html(selected_option);
    });
});

...

<select id="quantity_select">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
</select>

<div id="counter"></div>

Вы можете использовать text() вместо val(), если хотите видеть фактический текст вместо value атрибута.