Forum Moderators: open

Message Too Old, No Replies

How to Access Elements of Arrays Created by split() Method?

Please Help!

         

webgaya

9:53 am on May 31, 2006 (gmt 0)

10+ Year Member



I created a test script which accepts set of words
(separated by new lines) from the user and prints
them in a table with an index for each.

But the output is "5 undefined" (After entering 4
words in the text box).

Please tell me how to correct this.
Bellow is the complete code.

====

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Ordered Words</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
<!--
document.writeln("<table>");
function order()
{
var words=inputform.inputdata.value.split("\n");
for (var i=0; i<words.length; i++)
document.writeln("<tr> <td>");
document.writeln(i+1);
document.writeln("</td> <td>");
document.writeln(words[i]);
document.writeln("</td> </tr>");
}
document.writeln("</table>");
//-->
</script>
</head>
<body>
<form name="inputform" action="">
<textarea name="inputdata" rows="10" cols="40"></textarea>
<input name="generate" type="button" value="Generate" onClick="order()">
</form>
</body>
</html>

RonPK

10:27 am on May 31, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Some thoughts:

1. using document.writeln after the document has been rendered in the browser usually is not a good idea, as it may replace the original content.

2. if you're using more than one statement in a for-loop, the statements must be enclosed with brackets { and }.

Try this:

<script type="text/javascript"> 
<!--
function order()
{
var output = "<table>";
var words=inputform.inputdata.value.split("\n");
for (var i=0; i<words.length; i++)
{
output += "<tr> <td>" + (i+1) + "</td> <td>";
output += words[i];
output += "</td> </tr>";
}
output += "</table>";
document.getElementById('result').innerHTML = output;
}
//-->
</script>
</head>
<body>
<form name="inputform" action="">
<textarea name="inputdata" rows="10" cols="40"></textarea>
<input name="generate" type="button" value="Generate" onClick="order()">
</form>
<div id="result"></div>

The script stores the output in a variable while looping through the array. It then 'writes' it into the innerHTML-property of a special <div>.

webgaya

3:12 pm on Jun 1, 2006 (gmt 0)

10+ Year Member



Thank you very much RonPK!

If I enter,

Pacific is an ocean
Britain is an island

It outputs,

1 Pacific is an ocean
2 Britain is an island

If I want to make the output as

1 Pacific+is+an+ocean
2 Britain+is+an+island

What are the additional codes that I should add?

RonPK

4:08 pm on Jun 1, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



JavaScript has a method called replace() which should do the trick.

Instead of

output += words[i];
, try this:

output += words[i].replace(/ /g, "+");

webgaya

6:20 pm on Jun 2, 2006 (gmt 0)

10+ Year Member



Thanks again RonPK! It worked!

jshanman

6:30 pm on Jun 2, 2006 (gmt 0)

10+ Year Member



Just for future reference:

var x = "This is some text seperated by spaces";
var y = x.split(" ");
var z = y.join('+');
//z now contains "This+is+some+text+seperated+by+spaces"

however, replace() is obviously the better choice in this case.

- JS