Php 在单击一个div时将一个id传递给model,并基于model内部的id显示数据

Php 在单击一个div时将一个id传递给model,并基于model内部的id显示数据,php,Php,这是自动生成div的MySQL代码: <?php $sql = "select id,city, event_date, capacity, eb_deadline, regular_deadline, venue, earlybirdstudentprice, regularstudentprice, lastminutestudentprice, earlybirdstudentcount, regularstudentcount, lastminutestudentcount

这是自动生成div的MySQL代码:

<?php
    $sql = "select id,city, event_date, capacity, eb_deadline, regular_deadline, venue, earlybirdstudentprice, regularstudentprice, lastminutestudentprice, earlybirdstudentcount, regularstudentcount, lastminutestudentcount, earlybirdproprice, regularproprice, lastminuteproprice, earlybirdprocount, regularprocount, lastminuteprocount from tbl_events";

    $query = mysql_query($sql);

    while ($row = mysql_fetch_array($query)) {

        $id = $row['id'];
        $city = $row['city'];
        $event_date = $row['event_date'];

        $date = date('F d', strtotime($event_date));

        $capacity = $row['capacity'];
        $eb_deadline = $row['eb_deadline'];
        $regular_deadline = $row['regular_deadline'];
        $venue = $row['venue'];
        $earlybirdstudentprice = $row['earlybirdstudentprice'];
        $regularstudentprice = $row['regularstudentprice'];
        $lastminutestudentprice = $row['lastminutestudentprice'];
        $earlybirdstudentcount = $row['earlybirdstudentcount'];
        $regularstudentcount = $row['regularstudentcount'];
        $lastminutestudentcount = $row['lastminutestudentcount'];
        $earlybirdproprice = $row['earlybirdproprice'];
        $regularproprice = $row['regularproprice'];
        $lastminuteproprice = $row['lastminuteproprice'];
        $earlybirdprocount = $row['earlybirdprocount'];
        $regularprocount = $row['regularprocount'];
        $lastminuteprocount = $row['lastminuteprocount'];
?>

<div class="col-sm-4">
    <div class="card">
        <a href="#myModal" role="button" data-toggle="modal">
        <img src="img/bang.png" alt="Avatar" style="width:100%"></a>
        <h4><b><?php echo $date; ?>, <?php echo $city; ?></b></h4>
    </div>
</div>

<?php
}
?>

, 
现在,单击div后,我想将该div中显示的数据的id传递给model,并基于它获取数据以在model中显示它。我的模式代码是:

<div id="myModal" class="modal fade" role="dialog">
  <div class="modal-dialog" align="center">

    <!-- Modal content-->
    <div class="modal-content" align="center">
      <div class="modal-header" align="center">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <!-- <h2 class="modal-title">You're buying Tickets for</h2><br> -->
        <h1 class="modal-title"><br>3D Printing Workshop</h1><br>
        <h4 class="modal-title">July 14, Mumbai</h4>
        <h5 class="modal-title">9.30 AM - 4.30 PM</h5><br>
        <h5 class="modal-title">iKeva, Lower Ground 2, Art Guild House, Phoenix Market City, Mumbai 123456</h5>
      </div>
      <div class="modal-body" align="center">

                <div class="container">
    <div class="tabs">
        <div class="col-sm-1"></div>
        <div class="col-sm-8 col-xs-12">
            <div class="title">
                <h2>1. Choose Attendee Type</h2><br>
                <h5><em>Tickets are strictly available on a First Come First Serve Basis only. <br> Students have to provide valid Student ID cards during Check-in</em></h5><br>
            </div>
            <br>
            <ul class="nav nav-tabs nav-justified">
              <li class="active" ><a data-toggle="tab" href="#professionals">Professionals</a></li>
              <li><a data-toggle="tab" href="#students">Students</a></li>
            </ul>
            <br>
            <form>
                <div class="tab-content">
                  <div id="professionals" class="tab-pane fade in active">
                    <table class="table">
                        <tbody>
                            <tr>
                                <td>Early Bird Ticket</td>
                                <td>Ends on Mar 17</td>
                                <td>5 Left</td>
                                <td><select class="form-control" id="tickets">
                                        <option value="1">1</option>
                                        <option value="2">2</option>
                                        <option value="3">3</option>
                                        <option value="4">4</option>
                                        <option value="5">5</option>
                                    </select>
                                </td>
                                <td>x</td>
                                <td>Rs. 1499/-</td>
                            </tr>
                            <tr>
                                <td>Regular Ticket</td>
                                <td>Ends on Mar 20</td>
                                <td></td>
                                <td><select class="form-control" id="tickets1" disabled>
                                        <option value="1">1</option>
                                        <option value="2">2</option>
                                        <option value="3">3</option>
                                        <option value="4">4</option>
                                        <option value="5">5</option>
                                    </select>
                                </td>
                                <td>x</td>
                                <td>Rs. 1999/-</td>
                            </tr>
                            <tr>
                                <td>Last Minute Ticket</td>
                                <td>Ends on Mar 24</td>
                                <td></td>
                                <td><select class="form-control" id="tickets2" disabled>
                                        <option value="1">1</option>
                                        <option value="2">2</option>
                                        <option value="3">3</option>
                                        <option value="4">4</option>
                                        <option value="5">5</option>
                                    </select>
                                </td>
                                <td>x</td>
                                <td>Rs. 2999/-</td>
                            </tr>
                            <tr>
                                <td></td>
                                <td></td>
                                <td colspan="4"><hr style="width: 100%; margin-top: 0; margin-bottom: 0"></td>
                            </tr>
                            <tr>
                                <td><input type="text" style="font-size: 12px;" placeholder="Discount Coupon"><button class="btn btn-link">Apply</button></td>
                                <td></td>
                                <td colspan="3"><em>(incl of all taxes)</em></td>
                                <td>Rs. 1998/-</td>
                            </tr>
                        </tbody>
                    </table>
                  </div>
                  <div id="students" class="tab-pane fade">
                    <table class="table">
                        <tbody>
                            <tr>
                                <td>Early Bird Ticket</td>
                                <td>Ends on Mar 17</td>
                                <td>5 Left</td>
                                <td><select class="form-control" id="tickets3">
                                        <option value="1">1</option>
                                        <option value="2">2</option>
                                        <option value="3">3</option>
                                        <option value="4">4</option>
                                        <option value="5">5</option>
                                    </select>
                                </td>
                                <td>x</td>
                                <td>Rs. 1499/-</td>
                            </tr>
                            <tr>
                                <td>Regular Ticket</td>
                                <td>Ends on Mar 20</td>
                                <td></td>
                                <td><select class="form-control" id="tickets4" disabled>
                                        <option value="1">1</option>
                                        <option value="2">2</option>
                                        <option value="3">3</option>
                                        <option value="4">4</option>
                                        <option value="5">5</option>
                                    </select>
                                </td>
                                <td>x</td>
                                <td>Rs. 1999/-</td>
                            </tr>
                            <tr>
                                <td>Last Minute Ticket</td>
                                <td>Ends on Mar 24</td>
                                <td></td>
                                <td><select class="form-control" id="tickets5" disabled>
                                        <option value="1">1</option>
                                        <option value="2">2</option>
                                        <option value="3">3</option>
                                        <option value="4">4</option>
                                        <option value="5">5</option>
                                    </select>
                                </td>
                                <td>x</td>
                                <td>Rs. 2999/-</td>
                            </tr>
                            <tr>
                                <td></td>
                                <td></td>
                                <td colspan="4"><hr style="width: 100%; margin-top: 0; margin-bottom: 0"></td>
                            </tr>
                            <tr>
                                <td><input type="text" style="font-size: 12px; text-align: center;" placeholder="Discount Coupon"><button class="btn btn-link">Apply</button></td>
                                <td></td>
                                <td colspan="3"><em>(incl of all taxes)</em></td>
                                <td>Rs. 1998/-</td>
                            </tr>

                        </tbody>
                    </table>
                  </div>
                </div>
                <br>

                    <div class="title">
                        <h2>2. Attendee Details</h2><br>
                        <h5><em>Please enter details of individual Attendee(s). <br> In case of multiple attendees, Billing details should be same as the first Attendee.</em></h5><br>
                    </div>
                    <br>
                    <table class="table" id="attendees">

                        <tbody>
                            <tr>
                            <td><input type="text" class="form-control" name="" placeholder="Name"></td>
                            <td><input type="text" class="form-control" name="" placeholder="Email"></td>
                            <td><input type="text" class="form-control" name="" placeholder="Mobile No."></td>
                            </tr>
                        </tbody>

                    </table>

            </form>
        </div>  
    </div>

</div>



        </div>
    </div>
</div>  
</div>

&时代;

3D打印工作坊
7月14日,孟买 上午9时30分至下午4时30分
孟买凤凰城市场艺术会馆2楼iKeva 123456 1.选择与会者类型
门票仅限先到先得
学生在办理入住手续时必须提供有效的学生身份证


早起票 完三月十七日 左五 1. 2. 3. 4. 5. x 1499卢比/- 定期票 完三月二十日 1. 2. 3. 4. 5. x Rs.1999/- 最后时刻票 完三月二十四日 1. 2. 3. 4. 5. x 2999卢比/-
申请 (包括所有税费) 1998年卢比/- 早起票 完三月十七日 左五 1. 2. 3. 4. 5. x 1499卢比/- 定期票 完三月二十日 1. 2. 3. 4. 5. x Rs.1999/- 最后时刻票 完三月二十四日 1. 2. 3. 4. 5. x 2999卢比/-
申请 (包括所有税费) 1998年卢比/-
2.与会者详细信息
请输入个别与会者的详细信息
如果有多个与会者,账单明细应与第一个与会者相同。
<div>
  <div id="hello" style="background-color:red; color :white;text-align:center; padding: 10px;">
  <span id="this">blah blah</span>
  <span id="something">More info</span>
  </div>
</div>
  <hr>
  <div id="modal">
    <div id="here1">Nothing</div>
    <div id="here2">Nohing2</div>
  </div>
$('div#hello').click(function(){
  var first= $('#this').html();
  var second= $('#something').html();
  $('#here1').html(first);
  $('#here2').html(second);
});
$('div#hello').click(function(){
      var id= $('#id').html();
      $.get('/my/api/resource', {id: id}, function(data){
            $('#target').html(data.whatever);
      });
    });