根據下拉選擇填充Textfields

我知道有很多像Stack Overflow這樣的問題，但我真的需要更多的東西與我正在做的事情有關......所以這就是我發佈這個問題的原因。根據下拉選擇填充Textfields

我有一個PHP表單，它從MSSQL數據庫中提取數據以填充下拉框。我希望能夠填充聯繫信息文本框，只要我從我的下拉框中選擇一個名稱即可。到目前爲止，如果我選擇某個特定的供應商，我會將其自動輸入到名稱，電子郵件和電話號碼字段中。但是，我想要在文本字段中輸入不同的屬性，而不是供應商名稱本身。我怎麼能這樣做？

從我的與我想的進口被命名爲MR_POC_N，MR_POC_E和MR_POC_P

也是「MR_Name」你看到的是字段的所有名稱的姓名，電子郵件和電話號碼數據庫中的字段供應商FYI。請幫忙！

這裏是我的HTML代碼下拉列表：

<select name="vendor_dropdown" id="ven" onChange="updateinput();"> 
    <option value="">Choose a Vendor</option> 
     <?php foreach($users->fetchAll() as $user): ?> 
      <option><?php echo $user['MR_Name'];?></option> 
     <?php endforeach; ?> 
</select>

這裏是更新輸入功能我在JS。我知道這是關閉的，但尋找某種方向，因爲我不是在JS最好的：

function updateinput() { 


    var e = document.getElementById("ven"); 
     var venSelected = e.options[e.selectedIndex].value; 

     document.getElementById("name").value=venSelected; 
     document.getElementById("email").value=venSelected; 
     document.getElementById("tel").value=venSelected; 
    }

這是我的聯繫方式的代碼：

<table align="center"> 
    <tr> 
     <td align="right">Name:</td> 
     <td><input class="textbox" type="text" id="name" name="name"></td> 
    </tr> 
    <tr> 
     <td align="right">Email:</td> 
     <td><input class="textbox" type="email" id="email" name="email"></td> 
    </tr> 
    <tr> 
     <td align="right">Phone Number:</td> 
     <td><input class="textbox" type="tel" id="tel" name="number"></td> 
    </tr> 
</table>

來源

2016-09-27 Rataiczak24

既然要填充數據已經在你的'$ user'變量中，實現你想要做的最好的方法是使用數據屬性。

這很簡單，你存儲你的數據在您選擇的屬性，那麼你就可以訪問你的JS的值，這裏是你如何能做到這一點：

<select name="vendor_dropdown" id="ven" onChange="updateinput();"> 
    <option value="">Choose a Vendor</option> 
     <?php foreach($users->fetchAll() as $user): ?> 
      <option 
        data-name="<?php echo $user['MR_POC_N'];?>" 
        data-email="<?php echo $user['MR_POC_E'];?>" 
        data-phone="<?php echo $user['MR_POC_P'];?>" 
      > 
       <?php echo $user['MR_Name'];?> 
      </option> 
     <?php endforeach; ?> 
</select>

這樣，所有的數據wiil是從JS側的過程使用的方式訪問：

var venSelected = e.options[e.selectedIndex]; 

document.getElementById("name").value = venSelected.dataset.name

這裏是講一點關於數據的屬性，它絕不會傷害一個鏈接;）

https://developer.mozilla.org/en/docs/Web/Guide/HTML/Using_data_attributes

來源

2016-09-27 13:48:30

好的，只要它自動在其中一個字段中填充名稱，而不是全部3 ...因此我只需要能夠讓它現在填充電子郵件和電話號碼框。。爲了解決這個問題，會做些什麼？ – Rataiczak24

我能弄明白！非常非常感謝你！！問題解決了！！ – Rataiczak24

根據下拉選擇填充Textfields

回答

相關問題