Question

我有一个php页面的dealer.php，其中包含html表格中的所有经销商列表，但我想对页面进行一些更改，并根据美国州名称显示经销商信息（地图http://i.imgur.com/HJ3H8sw.png）使用html图像映射输入并选择选项。目前，我可以通过用户类从数据库中获取所有活动（已批准）经销商信息：

public function getActiveUsers()
{

    $sql = "SELECT * FROM " . self::uTable
    . "\n WHERE active = 'y'" 
    . "\n ORDER BY username";
    $row = self::$db->fetch_all($sql);

    return ($row) ? $row : 0;
}

并使用foreach循环在前端显示所有这些：

<?php $data = $user->getActiveUsers(); ?>

<?php foreach ($data as $row):?>
    <?php echo $row->name;?>
    <?php echo $row->address;?>
    <?php echo $row->city;?>
    <?php echo $row->state;?>
    <?php echo $row->zip;?>
    <?php echo $row->website;?>
<?php endforeach;?>

<?php unset($row);?>

但是我想在从图像映射中单击其中一个状态名称或从选择状态中选择一个状态后才输出结果。如何完成它并以HTML表格格式显示结果？

输入选项：

<img src="assets\images\USA-States-Map.png" alt="USA Map" usemap="#USA-States-Map" style="border-style:none" />

<map id="USA-States-Map" name="USA-States-Map">
    <area shape="poly" alt="WYOMING" coords="210,119,208,137,205,150,203,164,202,177,200,185,207,187,231,190,258,193,276,195,289,195,292,163,293,142,294,130,294,127,280,127,261,125,242,123,220,120" title="WYOMING" onMouseOver="WYOMING" />

    <area shape="poly" alt="RHODE_ISLAND" coords="705,150,705,147,703,143,703,141,705,140,706,140,707,141,708,143,709,146,709,148,708,150,705,152" title="RHODE_ISLAND" onMouseOver="RHODE_ISLAND" />
</map>

<select name="state">
    <option value="WYOMING">WYOMING</option>
    <option value="RHODE_ISLAND">RHODE ISLAND</option>
</select>

输出格式：

<table class="table">
    <thead>
      <tr>
        <th class="header">Name</th>
        <th class="header">Address</th>
        <th class="header">City</th>
        <th class="header">State</th>
        <th class="header">Zip</th>
        <th class="header">Website</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
      </tr>
    </tbody>
</table>

Answer 1

您可能希望使用选择框的onchange事件并调用getActiveUsers并将表单变量传递给它....这样的事情：

<select class="field" name="state" onchange="getActiveUsers(this.form)">

使用图像映射和html选择元素从数据库中检索经销商信息

1 个答案: