How to apply an array through an input with type=text to a javascript variable?

Question

I want to write an array like [1, 2, 3] into the text input on the html page and by clicking on the button apply it to the var array of the function called inputArray().
I tried to do so using

var array=document.querySelector("#inputNumber").value;

but that doesn't apply it as an array, just as a string I guess.
The other function called numbeRray(array) will then check if the array only consists of numbers.
Right now it checks if the single characters of the string are numbers because I wasn't able to add an array yet...

function numbeRray(array) {
  for (var a = 0; a < array.length; a++) {
    if (isNaN(array[a])) {
      throw new Error('The element in position ' + (a + 1) + ' of the array is not a number');
    }
  }
}

function inputArray() {
  var array=document.querySelector("#inputNumber").value;
  try {
    numbeRray(array);
  } catch (error) {
    alert(error.message);
    return;
  }
  alert(array);
}

<input type="text" id="inputNumber"/>

<button type="button" onclick="inputArray();">Check Array</button>

Can you give an example of what you will type into your text field? For example, are you typing 1,2,3 or 1 2 3`, or what? — GetSet
– GetSet, Commented Jan 15, 2021 at 1:36
You can't do that. The value of a text input will always be a string. Try JSON.parse(val) after you get the value from the input — lastr2d2
– lastr2d2, Commented Jan 15, 2021 at 1:41
You will need to parse that string into it's parts, and do a parseInt()on each part, then .push() it into the array. That's one way. ... A quicker way, would be to eval() it (though probably not recommended unless you sanitize the string first). — GetSet
– GetSet, Commented Jan 15, 2021 at 1:41

vipcxj · Accepted Answer · 2021-01-15 01:55:38Z

1

function numbeRray(array) {
  try {
    array = JSON.parse(array);
  } catch (e) {
    throw new Error("Invalid input.")
  }
  if (!Array.isArray(array)) {
    throw new Error("Not array.")
  }
  for (var a = 0; a < array.length; a++) {
    if (typeof array[a] !== 'number' || isNaN(array[a])) {
      throw new Error('Das Element an Position ' + (a + 1) + ' des Arrays ist keine Zahl');
    }
  }
}

function inputArray() {
  var array=document.querySelector("#inputNumber").value;
  try {
    numbeRray(array);
  } catch (error) {
    alert(error.message);
    return;
  }
  alert(array);
}

<!DOCTYPE html>
<html lang="de">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Fehlerbehandlung</title>
</head>

<body>
<input type="text" id="inputNumber"/>

<button type="button" onclick="inputArray();">Check Array</button>

  <script type="text/javascript" src="js/code6.js"></script>
</body>

</html>

Since the input is a json, Use JSON.parse to convert it to the array.

edited Jan 15, 2021 at 1:55

answered Jan 15, 2021 at 1:43

vipcxj

1,1107 silver badges12 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

JackFrost Over a year ago

Thank you very much for the answers. I fixed it by updating the variable called array to var array=JSON.parse(document.querySelector("#inputNumber").value); Now it is working the way I wanted.

Collectives™ on Stack Overflow

How to apply an array through an input with type=text to a javascript variable?

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related