Searching for entered value using For loop (JavaScript)

anonymous
May 2, 2023
168 views
2 votes
3 Answers

I have written a code to check if a particular string that is entered through an input by a user exists within a predefined array, however I faced a problem and I am looking for help Here is the code, the problem is that the code only works for the final array value!:

<p id="ggg"></p>
<p id="tr"></p>
<input type="text" id="WW" value="">
<button type="submit" id="searchh">Search for name</button>
var QQ=""
var arry= ["ASd", "aa", "frgr", "rgtg", "gtfh"]

<script>
 document.getElementById("searchh").addEventListener("click", function() {
    QQ = document.getElementById("WW").value.toLowerCase()
    for (var p=0; p<arry.length;p=p+1) {
    document.getElementById("ggg").innerHTML = document.getElementById("ggg").innerHTML+
    arry[p] +  " "

    var OO= document.getElementById("ggg").innerHTML.toLowerCase()
    if (QQ==OO) {
    document.getElementById("tr").innerHTML = "Student name found" + "n"
    } else {
    document.getElementById("tr").innerHTML = "No match found" + "n"
    }
    }
 })

I Have tried my best to no avail, Al Hamdulillah.

Tags: javascript

Answers

The problem with your code is that you are checking the input string against the entire string of all the elements in the array concatenated together. This will only match if the input string is the same as the entire concatenated string.

var QQ = "";
var arry = ["ASd", "aa", "frgr", "rgtg", "gtfh"];

document.getElementById("searchh").addEventListener("click", function() {
    QQ = document.getElementById("WW").value.toLowerCase();
    var matchFound = false; // initialize matchFound variable to false
    for (var p = 0; p < arry.length; p = p + 1) {
        document.getElementById("ggg").innerHTML = document.getElementById("ggg").innerHTML + arry[p] + " ";
        var element = arry[p].toLowerCase();
        if (QQ === element) {
            matchFound = true;
            break; // exit loop if match is found
        }
    }
    if (matchFound) {
        document.getElementById("tr").innerHTML = "Student name foundn";
    } else {
        document.getElementById("tr").innerHTML = "No match foundn";
    }
});

var QQ=""
var arry= ["ASd", "aa", "frgr", "rgtg", "gtfh"]


 document.getElementById("searchh").addEventListener("click", function() {
    QQ = document.getElementById("WW").value.toLowerCase()
    for (var p=0; p<arry.length; p++) {
    
    document.getElementById("ggg").innerHTML = document.getElementById("ggg").innerHTML+
    arry[p] +  " "    
    
    if (arry[p] === QQ) {
      document.getElementById("tr").innerHTML = "Student name found" + "n"
      break;
    } else {
      document.getElementById("tr").innerHTML = "No match found" + "n"
    }
    }
 })

<p id="ggg"></p>
<p id="tr"></p>
<input type="text" id="WW">
<button type="submit" id="searchh">Search for name</button>

using include method

var QQ=""
var arry= ["ASd", "aa", "frgr", "rgtg", "gtfh"]


 document.getElementById("searchh").addEventListener("click", function() {
    QQ = document.getElementById("WW").value.toLowerCase()
    for (var p=0; p<arry.length; p++) {
    
    document.getElementById("ggg").innerHTML = document.getElementById("ggg").innerHTML+
    arry[p] +  " "    
    
    if (arry.includes(QQ)) {
      document.getElementById("tr").innerHTML = "Student name found" + "n"
      break;
    } else {
      document.getElementById("tr").innerHTML = "No match found" + "n"
    }
    }
 })

<p id="ggg"></p>
<p id="tr"></p>
<input type="text" id="WW">
<button type="submit" id="searchh">Search for name</button>

You can be use array filter instead of using for loop

      var QQ = "";
      var arry = ["ASd", "aa", "frgr", "rgtg", "gtfh"];

    document.getElementById("searchh").addEventListener("click", function ()        {
        QQ = document.getElementById("WW").value.toLowerCase();
       
       var res= arry.filter(element => element.toLowerCase() == QQ);
        document.getElementById("ggg").innerHTML=arry.join(',')


    
        if (res.length>0) {
            document.getElementById("tr").innerHTML = "Student name foundn";
        } else {
            document.getElementById("tr").innerHTML = "No match foundn";
        }
    });

Please signup or login to give your own answer.

Click here to cancel reply.