javascript - 将查询结果的值传递给Modal

Question

我想将查询结果传递给Modal。结果包含项目列表和描述 结果的每一行都有一个出价按钮。出价按钮打开包含项目信息的模式。

我想显示模型中相应行的详细信息，但我无法做到。

这是代码。

<div class="col-lg-12">
<center>
 <table class="auction_det" style="width:100%;" border="1">
 <th>ID</th>
    <th>Item Name</th>
    <th>Description</th>
    <th>Cost</th>
    <th>Current Bid</th>
    <th>Close Date</th>
    <th>Image</th>
  <?php
    if( !empty($results) ) 
    {

    foreach($results as $row) {

    echo '<tr>';
    echo '<td id="id">'.$row->item_id.'</td>';
    echo '<td class="name">'.$row->name.'</td>';
    echo '<td class="desc">'.$row->item_desc.'</td>';
    echo '<td class="cost">'.$row->item_cost.'</td>';
    echo '<td class="open">'.$row->open_date.'</td>';
    echo '<td class="date">'.$row->close_date.'</td>';
    echo '<td class="img"><center><img style="width:300px;height:100px;"src='.$row->img_path.'></center></td>';
    ?>
    <td><button type="button" class="btn" data-toggle="modal" data-target="#moreInfo">Bid</button></td><?php    
    echo '</tr>';

}
}
?>
</table>

脚本

<script>
    $(document).ready(){
        $('.btn').click(function(){
            var $row = $(this).closest('tr');
            var name =  $row.find('.name').val();
            $('#name').text(name);
            $('#moreInfo').modal('show');
        });
    });//END document.ready
</script>

模态

 <div class="modal fade" tab-index="-1" id="moreInfo" role="dialog" aria-labelledby="moreInfoLabel" aria-hidden="true">
       <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
            <h3>Item Details</h3>
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="moreInfoLabel"></h4>
           </div>
          <div="modal-body">
        <p>Name:<label id="name"> *QUERY RESULT HERE* </label></p>
</div>

Answer 1

不要使用 var name = $row.find('.name').val(); 使用:

var name = $row.find('.name').text(); 或 var name = $row.find('.name').html();