Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <blockquote> <p>What I mean is, on a page the user can enter one number or thirty numbers, then he/she presses the OK button and the next page shows the array in the same order as it was entered, one element at a time.</p> </blockquote> <p>Ok, so you need some user input first? There's a couple of methods of how to do that.</p> <ol> <li>First is the <code>prompt()</code> function which displays a popup asking the user for some input. <ul> <li>Pros: easy. Cons: ugly, can't go back to edit easily.</li> </ul></li> <li>Second is using html <code>&lt;input type="text"&gt;</code> fields. <ul> <li>Pros: can be styled, user can easily review and edit. Cons: a bit more coding needed.</li> </ul></li> </ol> <p>For the <code>prompt</code> method, collecting your strings is a doddle:</p> <pre><code>var input = []; // initialise an empty array var temp = ''; do { temp = prompt("Enter a number. Press cancel or leave empty to finish."); if (temp === "" || temp === null) { break; } else { input.push(temp); // the array will dynamically grow } } while (1); </code></pre> <p><sub><em>(Yeah it's not the prettiest loop, but it's late and I'm tired....)</em></sub></p> <p>The other method requires a bit more effort.</p> <ol> <li>Put a single input field on the page.</li> <li>Add an <code>onfocus</code> handler to it. <ol> <li>Check if there is another input element after this one, and if there is, check if it's empty. <ul> <li>If there is, don't do anything.</li> <li>Otherwise, create a new input, put it after this one and apply the same handler to the new input.</li> </ul></li> </ol></li> <li>When the user clicks OK, loop through all the <code>&lt;input&gt;</code>s on the page and store them into an array.</li> </ol> <p>eg:</p> <pre><code>// if you put your dynamic text fields in a container it'll be easier to get them var inputs = document.getElementById('inputArea').getElementsByTagName('input'); var input = []; for (var i = 0, l = inputs.length; i &lt; l; ++i) { if (inputs[i].value.length) { input.push(inputs[i].value); } } </code></pre> <p>After that, regardless of your method of collecting the input, you can print the numbers back on screen in a number of ways. A simple way would be like this:</p> <pre><code>var div = document.createElement('div'); for (var i = 0, l = input.length; i &lt; l; ++i) { div.innerHTML += input[i] + "&lt;br /&gt;"; } document.body.appendChild(div); </code></pre> <p><strong>I've put this together so you can see it work at jsbin</strong><br> Prompt method: <a href="http://jsbin.com/amefu" rel="noreferrer">http://jsbin.com/amefu</a><br> Inputs method: <a href="http://jsbin.com/iyoge" rel="noreferrer">http://jsbin.com/iyoge</a></p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    3. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload