NiceBench
NiceBench

Reputation: 1

Function to Search for a Specified Value Within an Array?

I am fairly new to JavaScript and StackOverflow and am currently trying to create a function to search for a specialized value within a created array. I have written out what seems like a function that would work, any ideas or any obvious flaws in it? It is currently not working. Thanks!

HTML:


<td>Index: <input style = "width: 50px" input type ="textbox" id="Index"  value="2"/></td> <!-- HTML code to create the index textbox -->
<br/> <!-- Line Break -->
Value: <input style = "width: 50px" input type = "textbox" id="Value" value = "10"/> <!-- HTML code to create the value textbox -->
<br />
<td>Enter Value to Find: <input style="width: 50px;" type="textbox" value="20" />
<input type="button" value="Search Array" onClick = searchArray(); /></td>
<br />
<input type = "button" value = "Create" onClick = "createArray();"/>
<input type="button" value="Insert into Array" onClick="insertIntoArray();" />
<div id="result">

JS:

var myArray = [];
var d = ""; //This global variable is going to be used for clearing and populating the screen 

function createArray (){
    //This functions is to clear the current information on the screen so the array can populate
  clearScreen(); 
  //The next thing we want to do according to the lecture is create a FOR loop to run 100 times to set the various array values
  for (var i = 0; i <100; i++){
  myArray[i] = Math.floor(Math.random()* 100 + 1); //Math.floor rounds an number downards to the nearest integer then returns. Math.random returns a        integer randomly withing given variables
  }
  popScreen(); //function to fill the screen with the array 
}


function clearScreen(){
d = ""; //Global string variable mentioned before 
document.getElementById("result").innerHTML = "";
}


function popScreen(){
    for (var i = 0; i < myArray.length - 1; i++){
    d += i + ' : ' + myArray[i] + "<br/>";
  }
  document.getElementById("result").innerHTML = d;
}


function insertIntoArray(){
    clearScreen();
    var i= parseInt(document.getElementById("Index").value);
        var j = parseInt(document.getElementById("Value").value);
d = "inserting " + j+ " at " + i + "<br/>";
    
    var temp = myArray[i];
        for (i; i < 100; i++) {
        myArray[i] = j;
      j = temp
        temp = myArray[i+1];
      }
    popScreen();
}

**function searchArray(myArray, value){
  var searchResult = 0;
  var searchIndex = -1;
  for(var i = 0; i<myArray.length; i++){
    searchResult++;
    if(myArray[i] == value){
        searchIndex = i;
      break;
    }
  }
  
  if (searchIndex == -1){
    console.log("Element inquiry not found in array. Total Searched: " + searchResult);
  }else{
    console.log("Element found at index: " + searchIndex + ", search count: " + searchResult);
    }**
  }

Upvotes: 0

Views: 118

Answers (1)

Louys Patrice Bessette
Louys Patrice Bessette

Reputation: 33933

The issue is caused by the fact there are no arguments passed to the searchArray function via the inline onclick attribute... And they are necessary.

Uncaught TypeError: Cannot read properties of undefined (reading 'length')

The error thrown is because myArray is undefined and therefore has no length property.


To have it working, I would modify the HTML from:

<input type="button" value="Search Array" onClick = searchArray(); />

to:

<input type="button" value="Search Array" onClick = searchArray(this); />

And the function would change like this:

function searchArray(element) {

  let value = element.previousElementSibling.value
  // rest unchanged

searchArray being already defined at global scope, you don't need to pass it.

But you need the value from the input right before the button. You can get it using previousElementSibling.

Upvotes: 1

Related Questions