CODEWITHSUNDEEP
javascripthtml
Umor Uddin
Umor Uddin

Reputation: 3

how do I number an array (in a list)

Alright, in my results for my program the results are displayed in a horizontal list (for e.x, HI,HELLO,HI,HELLO). I am trying to get these results to be in a numbered list from top to bottom. 

function button() {
  var inputArray = [];
  var size = 4;

  for (var i = 0; i < size; i++) {
    inputArray[i] = prompt('Enter Element ' + (i + 1));
    inputArray.sort();
    document.getElementById("demo").innerHTML =
      inputArray.map(function(x) {
        return x.toUpperCase()
      });
  }

  var str = String(inputArray).toUpperCase().split(",");
}
<button onclick="button();">Array</button>
<p id="demo"></p>

https://repl.it/repls/DangerousCloudyNumber

Upvotes: 0

Views: 63

Answers (2)

dan1st
dan1st

Reputation: 16457

Just use an ordered list (<ol>) instead of a paragraph (<p>) and add list items (<li>) to the values while mapping them:

function button(){
    var inputArray = [];
  var size = 4; 
  
  for(var i=0; i<size; i++) {
    
    inputArray[i] = prompt('Enter Element ' + (i+1));
    inputArray.sort();
    document.getElementById("demo").innerHTML = inputArray.map(function(x){ return "<li>"+x.toUpperCase()+"</li>"}).join("");
  }
  var str = String(inputArray).toUpperCase().split(",");
  }
<!DOCTYPE html>
<html>
<head>
    <script src="script.js"></script>
    <meta charset="utf-8">
    <title>Program</title>
</head>
<body>
    <button onclick="button();">Array</button>
    <ol id="demo"></ol>
</body>
</html>

Upvotes: 1

Hritu Rathod
Hritu Rathod

Reputation: 99

function button(){
        var inputArray = [];
        var size = 4; 
        var final_html = "<ol>"
        for(var i=0; i<size; i++) {

            input = prompt('Enter Element ' + (i+1));
            if (input === null) {
                document.getElementById("demo").innerHTML = inputArray.map(function(x){ 
                    if (x != null) {
                        final_html = final_html +"<li>"+x.toUpperCase()+"</li>";
                    }
                });
                document.getElementById("demo").innerHTML = final_html;
                return; //break out of the function early
            }else{
                inputArray[i] = input;
            }
            inputArray.sort();
        }
    }

Upvotes: 0

Related Questions