HTML Imagemap As Form Submit

我目前正在嘗試爲在線託管的mysql數據庫創建一個簡單的php前端。HTML Imagemap As Form Submit

我正在進行的項目將在辦公樓內採用網格佈局的辦公桌並將它們變成圖像地圖。從那裏，取決於哪個席位被點擊，它將從MySQL數據庫中提取信息，填充表單的字段，並允許在必要時進行編輯。

我有幾個文件，它們的功能如下：

locator.php - 在「主頁」，其持有的圖像映射並且是座位號變量將從

表單來的。 php - 根據從locator.php傳遞的座位號碼（這是我計劃稍後完成的基本HTML表單），數據將填充的表單

我已經在網上看到過這個與一個常規的形式，但顯然一個圖像映射使事情有點棘手。我嘗試創建一個onClick（）事件，它接受點擊的座位號並將它傳遞給一個javascript函數，但是從那裏我就凍結了如何繼續到該變量的下一頁。

我覺得我有幾個想法只能部分在我的代碼中實現，而且我碰到了一堵牆。任何想法將不勝感激。

locator.php：

<img src="map.jpg" usemap="#disp_map"> 
<form name="formmap" action="form.html" method="post"> 
    <map name="disp_map"> 
     <area name="area_159" shape="rect" coords="11,261,58,308" href='#' onClick="submitform(159)" alt="#159"> 
     <area name="area_160" shape="rect" coords="11,311,58,358" href='#' onClick="submitform(160)" alt="#160"> 
    </map> 
</form> 

<br> 
<hr> 

<?php 
$dbhost = "<<removedforprivacy>>"; 
$dbname = "<<removedforprivacy>>"; 
$dbuser = "<<removedforprivacy>>"; 
$dbpass = "<<removedforprivacy>>"; 

try{ 
    $conn = mysql_connect($dbhost,$dbuser,$dbpass); 
    $db = mysql_select_db($dbname, $conn); 
    echo '<img src="check.jpg" alt="Database Connection Made">' . 'Connection to the server was successfully made.<br>'; 
}catch(Exception $e){ 
    echo 'Exception!: ' . $e->getMessage() . '<br>'; 
} 
?> 

<script language="javascript" type="text/javascript"> 
function submitform(jack) { 
    window.alert("Data will be displayed for jack #"+ jack +"."); 
    document.formmap.submit(); 
} 
</script>

來源

2013-12-08 Crucial Blue

你可以使用一個隱藏的輸入字段。只需將點擊事件的結果（座位號）放入該字段並按照正常情況提交即可。 – enhzflep

所以我的功能應該是類似這樣的... 'code' –

考慮下面的代碼片段：

<form name="formmap" action="form.html" method="POST"> 
    <input type='hidden' id='seatNumber'/> 
</form> 

function submitform(jack) { 
    window.alert("Data will be displayed for jack #"+ jack +"."); 
    document.getElementById('seatNumber').value = jack; 
    document.formmap.submit(); 
}

來源

2013-12-08 17:25:24 enhzflep

我會檢查看看是否能解決問題。支持... –

工程就像一個魅力。感謝您的指導！ –

HTML Imagemap As Form Submit

回答

相關問題