Извличане на HTML вход от текст и падащо меню в Javascript? - javascript, формуляри, текст, вход, падащо меню

Искам да осигуря на потребителите два механизма за въвеждане - въвеждане на текст и падащо меню с помощта на елемент. Входната стойност се извлича в javascript. (не се използва php).

Мога да накарам всеки метод да работи, но не едновременно.

Това вероятно е фундаментален въпрос, но може ли някой да обясни как трябва да настроя манипулатори на събития, както и стойност за всеки вход, за да направя тази работа?

<form name="myform"  onsubmit="return userInput()">
<select id="myVal" onchange="userInput()" onsubmit="return userInput()">
<option>Select a country</option>
<option value="All Countries">All Countries </option>
<option value="Austrailia">Austrailia</option>
<option value="Korea">Korea </option>
<option value="Austria">Austria </option>
<option value="United States of America">United States of America
</option>
<option value="Japan">Japan</option>
<option value="Canada">Canada </option>
<option value="India">India</option>
</select>


<!-- <input name="Submit"  type="submit" value="Add to list" > -->
<input type="text" id="myVal" placeholder="Add some text&hellip;">

</form>

// Javascript code where I fetch user input.

function userInput(event){
userinput = document.getElementById("myVal").value
//  console.log(userinput)
// console.log(document.getElementById("myVal").value)
//draw(document.getElementById("myVal").value)
d3.select("svg").remove();
main();
console.log("Main has been called")
// draw(document.getElementById("myVal").value)
return false;
}

Отговори:

Както избраният от вас елемент, така и въвеждането на текстелемент имат същия идентификатор. Направете ги уникални и направете едно обаждане за всеки елемент във вашия JS. Също така се отървете от атрибута за обработване на събития onsubmit в избрания от вас елемент.