|
Q189 How do you sort a number of lines of information in a textarea?
irt.org | Knowledge Base | JavaScript | Form 6 | Q189 [ previous next ]
Q189 How do you sort a number of lines of information in a textarea?
Here is the psuedo code:
- Obtain the value of the textarea.
- Split the value based of line breaks into an array.
- Sort the array.
- Join the array back together with line breaks.
A couple of problems:
- Not every browser uses the same line breaks. I don't know the exact details but some use \r\n and
some use just \n.
- Not every browser has support for the strings split() method.
- Not every browser has support for the arrays sort() method.
- Not every browser has support for the arrays join() method.
We should be able to overcome these problems though:
We can ignore the fact that browsers have different types of
linebreaks and just split the textarea on \n
The article
Split Ends
describes how to split strings, and how to split strings in JavaScript
1.0. Also describes how the two methods can be combined to provide a
script suitable for all browsers.
The article
Arrays, Object Arrays and Sorting
shows how to sort arrays using the JavaScript 1.1 array sort
method. It also describes the different options available during
sorting, and how to sort arrays for browsers that don't support the
sort method, or where the sort method does not work correctly.
We can write our own join() function.
So here is the code:
<html>
<head>
<script language="JavaScript"><!--
var splitIndex = 0;
var splitArray = new Array();
function splits(string,text) {
var strLength = string.length, txtLength = text.length;
if ((strLength == 0) || (txtLength == 0)) return;
var i = string.indexOf(text);
if ((!i) && (text != string.substring(0,txtLength))) return;
if (i == -1) {
splitArray[splitIndex++] = string;
return;
}
splitArray[splitIndex++] = string.substring(0,i);
if (i+txtLength < strLength)
splits(string.substring(i+txtLength,strLength),text);
return;
}
function split(string,text) {
splitIndex = 0;
splits(string,text);
}
function join(arrayName) {
var temp = '';
for (var i=0; i<splitIndex; i++)
temp += arrayName[i] + '\n';
if (escape(temp.substring(0,1)) == '%0A')
return temp.substring(1,temp.length);
else
return temp;
}
function sort(arrayName) {
for (var i=0; i<(splitIndex-1); i++)
for (var j=i+1; j<splitIndex; j++)
if (arrayName[j] < arrayName[i]) {
var dummy = arrayName[i];
arrayName[i] = arrayName[j];
arrayName[j] = dummy;
}
}
function sorttext() {
split(document.myform.mytext.value,'\n');
sort(splitArray);
document.myform.mytext.value = join(splitArray);
}
//--></script>
<script language="JavaScript1.1"><!--
function split(string,text) {
splitArray = string.split(text);
splitIndex = splitArray.length;
}
//--></script>
</head>
<body>
<form name="myform">
<textarea name="mytext" rows="9" cols="8">
Lion
Tiger
Bear
Fox
Rabbit
Anteater
Snake
Dog
Cat
</textarea>
<p><input type="button" value="sort" onClick="sorttext()">
</form>
</body>
</html>
|
Feedback on 'Q189 How do you sort a number of lines of information in a textarea?'
|
|