php javascript изменить innerHTML с помощью выбора значения из таблицы
У меня есть форма с полем ввода (FIELD1). Когда пользователь вводит в FIELD1, он фильтрует значения в FIELD2. Затем они нажимают на FIELD2, и он отображает значение, выбранное с помощью javascript (этот урок: http://www.tizag.com/javascriptT/javascript-innerHTML.php). Проблема, с которой я сталкиваюсь, заключается в том, что значение FIELD2 — это идентификатор компании в таблице — как мне включить JavaScript для поиска названия компании из таблицы. Картинка прилагается.
<script type="text/javascript">
function changeText2(){
var userInput = document.getElementById('cv_bus').value;
document.getElementById('boldStuff2').innerHTML = userInput;
document.getElementById('filterTxt').innerHTML = userInput;
}
</script><table style="width:500px;border:1px solid #000;">
<tr><td>2</td><td>Type in the box below to narrow the list of names:</td></tr>
<tr><td></td><td><input type="text" name="filterTxt" id="filterTxt" tabindex="2" style="width: 400px"></td></tr>
<tr><td></td><td><p>SELECTED: <font color=red><b id='boldStuff2'>NONE</b> </p></font></td></tr>
<tr><td></td><td>Select the apropriate name:</td></tr>
<tr><td></td><td><select autocomplete="off" id="cv_bus" name="cv_bus" size=15 tabindex="2" style="width: 400px" onclick="changeText2()">
<?php
include 'cv_con.php';
$get = mysqli_query($con,"SELECT * FROM cv_companies order by compname");
$result = mysqli_query($con,"SELECT * FROM cv_companies order by compname");
//$option = '';
while($row = mysqli_fetch_array($result)) {
$option .= '<option value = "'.$row['id'].'">'.$row['compname'].'</option>';
}
?>
<?php echo $option; ?></select>
Решение
var el = document.getElementById('cv_bus');
var text = el.options[el.selectedIndex].innerHTML;
Попробуйте в этом примере сначала получить идентификатор, а затем получить доступ к метке параметров.
Другие решения
замени это
var userInput = document.getElementById('cv_bus').value;
с
var userInput = cv_bus.options[cv_bus.selectedIndex].text;
Другой способ — передать это в функцию:
<select autocomplete="off" id="cv_bus" name="cv_bus" size=15 tabindex="2" style="width: 400px" onclick="changeText2(this);">
function changeText2(selObj){
var userInput = selObj.options[selObj.selectedIndex].text;
document.getElementById('boldStuff2').innerHTML = userInput;
document.getElementById('filterTxt').innerHTML = userInput;
}