+ 2
<!DOCTYPE html> <html> <body> <font size ="6" color="yellow" align="center"><div id="rectangle"><p>Lucid</p></div></font> <input type="text" id="myText" placeholder="Type a country here"> <button onclick="myFunction()">Try it</button> <p id="demo"></p> <script> var cities = ["Dubai" , "London"]; //////SEARCH/////////// function myFunction() { var x = document.getElementById("myText").value; var found = false; for(var i = 0; i < cities.length; ++i) { if(x == cities[i]) { alert("Loading results for " + x); found = true; break; } } if(!found) { alert("Please try again"); } } ///////////////////// </script> </body> </html>
18th Sep 2017, 8:02 PM
ChaoticDawg
ChaoticDawg - avatar
0
Here you can use a placeholder instead of a value: <input type="text" id="myText" placeholder="Type a country here"> In your script you're missing the closing curly brace for the function, the line alert(x) is what is outputting what is entered into the input box, (x == "cities") this is checking the value of x against the string "cities" not one of the values in the array cities. You need to access and compare against the values in the array instead. (x !== cities) is always true in this case as you're comparing a string to an array and seeing if they are not equal (which is true) var cities = ["Dubai" , "London"]; function myFunction() { var x = document.getElementById("myText").value; alert(x); //<-- outputs what was entered if(x == "cities") { // <-- comparing the input string to the string "cities" alert("Loading results for " + x); } else if(x !== cities) { // <-- this will always be true as your comparing a string to an array alert("Please try again"); } } //<-- missing
18th Sep 2017, 7:27 PM
ChaoticDawg
ChaoticDawg - avatar