Member Avatar for FutureDev86

I am tryin to put to display the elements of an array, with each element of the array on a seperate line.

<script type="text/javascript">

        var names = prompt("Enter Names:","Enter names here.");
        var names_array = [names.split(" ")];
        var array_length = names_array.length;
        var i = 0;
        var array_display = names_array.join("<br>");

        for (i;i<array_length;i++)
        {
            document.write("You entered the following names:"+"<br>"+array_display)
        }

    </script>

Please, anyone, what am I doing wrong here? It is probably the simplest thing, but for the life of me, I can't figure out what works.

Thanks in advance

Edited by FutureDev86
  • 3 Contributors
  • 4 Replies
  • 125 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by Airshow
Member Avatar for MarPlo

Hi,
Try this script:

<script type="text/javascript">
var names = prompt("Enter Names:", "Enter names here.");
document.write('You entered the following names:<br>'+ names.replace(/[ ]/g, '<br/>'));
</script>
Member Avatar for Airshow

what am I doing wrong here?

Several things, chief amongs which is that you don't need a loop when.join() has already reduced the array to a string and you only want "You entered the following names:" to appear once.

Also, document.write() can be pretty evil. Used incorrectly, it will cause the whole document, including its javascript environment to be overwritten. It's a good idea to become familiar with inserting content into hard-coded HTML elements.

The following code relies on something like <div id="namesContainer"></div> to appear somewhere in the document, and inserts the names int it.

window.onload = function(){
    var names = prompt("Enter Names:", "Enter names here.");//ask for names
    if (names) {//prevent error if the user cancels the prompt
        var container = document.getElementById("namesContainer");//find DOM node in which to diplay the names
        if (container) {
            container.innerHTML = "You entered the following names:<br>" + names.split(" ").join("<br>");
        }
    }
}

Place this code inside <script></script> tags in your document's <head></head>.

Note that the code is phrased as a window.onload handler to ensure that it executes once the HTML has been rendered. Otherwise, the DOM node arising from <div id="namesContainer"></div> will not exist when the code executes.

See working code here.

Edited by Airshow because: formatting
Member Avatar for FutureDev86

Thank you very much! I am taking a course in Javascript. I see that I have a lot to learn. But, thus far, I am thoroughly enjoying my new journey. Also, do you have any suggestions towards any readings that I should look into?

Member Avatar for Airshow

As with any programming language, the basics are :

  • variable typing and type juggling
  • variable scope
  • equating-by-value versus equating-by-reference

All of this is available, via search engines, on the web.

Then learn all about functions as first class objects. This aspect is confined to a small group of languages of which javascript is one.

If you want a book, then I recommend O'Reilly's "JavaScript: The Definitive Guide" by David Flanagan. Make sure you get the latest edition (currently 6th).

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.