我创建了一个插件,将车辆插入数据库表,在该表的管理端显示车辆。一个页面用于该插件的设置。插件的管理端大部分已完成。现在我想显示出租车预订的表格。当用户在操作页面中提交该表单,我想显示带有付款选项的位置和距离的谷歌地图。我用谷歌搜索但没有找到最佳方式。我应该如何创建插件前端?我应该从哪里开始?有人可以建议我吗?
这是我想在前面显示的表格
<form name="book_form" id="book_form" action="" method="POST">
<!--<input type="hidden" name="action" value="tBM_taxibooking_save_booking" />-->
<table>
<tbody>
<tr>
<th>Select Location Points On Google Map</th>
<td>
<select name="location_points" id="location_points">
<option value="points">Points</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>
</td>
</tr>
<tr>
<th>First Address Point</th>
<td><input type="text" name="first_point" id="first_point"></td>
</tr>
<tr>
<th>Second Address Point</th>
<td><input type="text" name="second_point" id="second_point"></td>
</tr>
<tr>
<th>Third Address Point</th>
<td><input type="text" name="third_point" id="third_point"></td>
</tr>
<tr>
<th>Fourth Address Point</th>
<td><input type="text" name="fourth_point" id="fourth_point"></td>
</tr>
<tr>
<th>Adult Seats</th>
<td>
<select name="adult" id="adult">
<option value="Adult Seats">Adult Seats</option>
<?php
$i=1;
for($i=1;$i<=10;$i++)
{ echo'<option value="'.$i.'">'.$i.'</option>'; }
?>
</select>
</td>
</tr>
<tr>
<th>Child Seats</th>
<td>
<select name="child" id="child">
<option value="Child Seats">Child Seats</option>
<?php
$i=1;
for($i=1;$i<=10;$i++)
{ echo'<option value="'.$i.'">'.$i.'</option>'; }
?>
</select>
</td>
</tr>
<tr>
<th>Suitcases</th>
<td>
<select name="suitcases" id="suitcases">
<option value="Suitcases">Suitcases</option>
<?php
$i=1;
for($i=1;$i<=50;$i++)
{ echo'<option value="'.$i.'">'.$i.'</option>'; }
?>
</select>
</td>
</tr>
<tr>
<th>Select Vehicle</th>
<td>
<select name="vehicle" id="vehicle">
<option value="vehicles">Select Vehicle</option>
<?php
while($row=mysql_fetch_assoc($results))
{
echo'<option value="'.$row['vechicle_id'].'">'.$row['vechicle_title'].'</option>';
}
?>
</select>
</td>
</tr>
<tr>
<th>Date</th>
<td><input type="text" name="date" id="date"></td>
</tr>
<tr>
<td colspan="2"><input type="submit" value="Get Map & Distance" id="submit" name="submit"></td>
</tr>
</tbody>
</table>
</form>