从组合框PHP更改值时更改价格

时间:2012-11-08 05:15:16

标签: php javascript jquery

我的代码有问题。我想在组合框的值更改时更改价格,但在while循环处理程序中,只处理第一个表行。

<script type="text/javascript">
    $(document).ready(function () {
        $('#size').change(function () {
            //alert("aaa");
            var x = $('#size').attr('value');
            //alert(x);
            $.ajax({
                type: "POST",
                url: 'sizeChange.php',
                data: 'size =' + size,
                success: function (data) {
                    alert(data);
                }
            })
        });
    });
</script>



<div id="price">
    <table border="1" width="200px">
     <tr>
        <td> Size </td>
        <td> Product</td>
        <td>Price</td>
     </tr>
    <?
       mysql_connect("localhost","root","") or die(mysql_error()); 
       mysql_select_db("test") or die(mysql_error());
       $query = mysql_query("select * from pricetest");
       if(!$query)
         { die(mysql_error());}
         else
        {
         while($row = mysql_fetch_array($query))
          {
            echo "<tr> ";
                ?>
             <td>
                 <select name="size" id="size">
                   <option value="1">1</option>
                   <option value="2">2</option>
                    <option value="3">3</option>
                  </select>
             </td>
             <td> <? $row['pd_name']; ?> </td>
             <td> <? $row['price']; 

                    }
                }?>
             </td>
        </tr>
      </table>
</div>

我可能做错了什么?

3 个答案:

答案 0 :(得分:0)

您可以使用var x = $('#size').val();代替var x = $('#size').attr('value'); 同时在ajax中以data: 'size =' + x发送数据。

答案 1 :(得分:0)

$(document).ready(function () {
    $('#size').change(function () {
        //alert("aaa");
        var x = $('#size').attr('value'); alert(x);
        //alert(x);
        $.ajax({
            type: "POST",
            url: 'getsize.php',
    data: 'size='+x,
            success: function (data) {
                alert(data);
            }
        })
    });
});

答案 2 :(得分:0)

这是因为您的所有元素都具有相同的ID(size)。

更改您的PHP代码:

$i = 1;
while($row = mysql_fetch_array($query))
{
    echo "<tr id='row".$i."'> ";
            ?>
     <td>
             <select name="size" class="size_dd" id="<?php echo $i ?>" >
                 <option value="1">1</option>
                 <option value="2">2</option>
                    <option value="3">3</option>
                </select>
     </td>
     <td class="pd_name" > <? $row['pd_name']; ?> </td>
     <td class="price" > <? $row['price']; ?> </td>
     <?php $i++ ?>
}

并将JS更改为:

<script type="text/javascript">
    $(document).ready(function () {
        $('.size_dd').change(function () {
            //alert("aaa");
            var size = this.value,
                                id = this.value;
            //alert(x);
            $.ajax({
                type: "POST",
                url: 'sizeChange.php',
                data: 'size =' + size,
                success: function (data) {
                    $('tr#row td.pd_name').html(data['pd_name']);
                    $('tr#row td.price').html(data['price']);
                }
            })
        });
    });
</script>