在php mysql表中提交按钮

时间:2013-02-15 21:12:13

标签: php javascript jquery

我有什么:

<table class="sortable table table-hover table-bordered">
  <thead>
  <tr>
    <th>CPU</th>
    <th>Speed</th>
    <th>Cores</th>
    <th>TDP</th>
    <th>Preformace</th>
    <th>Overclocing</th>
    <th>Price</th>
    <th>Buy</th>
  </tr>
  </thead>
  <tbody>
  <?php $i=0 ;
    do {
    $preformace = $row_Procesory['Preformace'];
    $over = $row_Procesory['Overclocing'];
    $i++; ?>
    <tr>
    <td><?php echo $row_Procesory['CPU']; ?></td>
    <td><?php echo $row_Procesory['Speed']; ?></td>
    <td><?php echo $row_Procesory['Cores']; ?></td>
    <td><?php echo $row_Procesory['TDP']; ?></td>
    <td><?php echo "
    <script type='text/javascript'>
    $(document).ready(function() {
    $('#progressbarP$i').height(10).progressbar({
                                    value : 1
                                    });
    $('#progressbarP$i .ui-progressbar-value').animate(
    {width: '$preformace%'},{queue: false});
    });
    </script>
    <div id='progressbarP$i' title='$preformace'></div>  
    ";?></td>

    <td><?php echo "
    <script type='text/javascript'>
    $(document).ready(function() {
    $('#progressbarO$i').height(10).progressbar({
                                    value : 1
                                    });             
    $('#progressbarO$i .ui-progressbar-value').animate({
        width: '$over%'
        }, 1000);
    });
    </script>
    <div id='progressbarO$i' title='$over'></div>  
    ";?></td>

    <td><?php echo $row_Procesory['Price']; ?></td>
    <!-- BUTTON SECTION -->
   <td><?php echo "<button class='btn btn-success' type='button' align='CENTER'>Add</button>";?></td>
  </tr>
    <?php } while ($row_Procesory = mysql_fetch_assoc($Procesory)); ?>
</tbody>
</table>

基本上我通过mysql循环并显示行。在preformace和overclocking列中,im显示带有mysql值的动画jquery progresbar。我还使用bootstrap和sortable.js来使表格可以排序。

How it looks like:

我想要的: 当我单击添加按钮时,处理器的名称将被发送到test.php作为变量。 我甚至不知道如何使用jquery:D

来定位name元素

2 个答案:

答案 0 :(得分:0)

如果我在这里理解你的问题可以提供帮助

<table class="sortable table table-hover table-bordered">
  <thead>
  <tr>
    <th>CPU</th>
    <th>Speed</th>
    <th>Cores</th>
    <th>TDP</th>
    <th>Preformace</th>
    <th>Overclocing</th>
    <th>Price</th>
    <th>Buy</th>
  </tr>
  </thead>
  <tbody>
  <?php $i=0 ;
    do {
    $preformace = $row_Procesory['Preformace'];
    $over = $row_Procesory['Overclocing'];
    $i++; ?>
    <tr>
    <td><?php echo $row_Procesory['CPU']; ?></td>
    <td><?php echo $row_Procesory['Speed']; ?></td>
    <td><?php echo $row_Procesory['Cores']; ?></td>
    <td><?php echo $row_Procesory['TDP']; ?></td>
    <td><?php echo "
    <script type='text/javascript'>
    $(document).ready(function() {
    $('#progressbarP$i').height(10).progressbar({
                                    value : 1
                                    });
    $('#progressbarP$i .ui-progressbar-value').animate(
    {width: '$preformace%'},{queue: false});
    });
    </script>
    <div id='progressbarP$i' title='$preformace'></div>  
    ";?></td>

    <td><?php echo "
    <script type='text/javascript'>
    $(document).ready(function() {
    $('#progressbarO$i').height(10).progressbar({
                                    value : 1
                                    });             
    $('#progressbarO$i .ui-progressbar-value').animate({
        width: '$over%'
        }, 1000);
    });
    </script>
    <div id='progressbarO$i' title='$over'></div>  
    ";?></td>

    <td><?php echo $row_Procesory['Price']; ?></td>
    <!-- BUTTON SECTION -->
   <td><?php echo "<button class='btn btn-success pro_btn' processor = '".$row_Procesory['CPU']."'  type='button' align='CENTER'>Add</button>";?></td>
  </tr>
    <?php } while ($row_Procesory = mysql_fetch_assoc($Procesory)); ?>
</tbody>
</table>

该解决方案(处理器属性)是为了避免选择器,如果您需要,我们可以提供其他选择器

$('.pro_btn').die('click').live('click',function(e){
     var name = $(this).attr('processor');
     $.post('test.php',{'processor_name':name}, function(response) {
    // log the response to the console
         console.log("Response: "+response);
     });

}); 

如果您不想使用该属性,可以执行以下操作

var name = $(this).closest('tr').find('td:first').text();

我希望这可以帮助:)

答案 1 :(得分:0)

捕获点击事件并找到最接近的'tr',然后找到'tr'的第一个'td'。那就是这样的:

$(this).closest('tr').find('td:first').text();

或者获取按钮的按钮,这将是td,而它们是td的父级。那将是tr。最后得到第一个td。

$(this).parent().parent().find('td:first').text();

或者只是在按钮中添加其他属性,然后获取值。

$(this).attr('processor');