JavaScript array functions sort

We try to explain you a example that makes easy to understand the concept of
JavaScript array function sort. The code create a HTML Page specifying Name, text
field and button 'Insert and sort'. The variable array instantiate an
array object .On click the button, function push( ) and show ( ) is invoked. The
function push ( ) evaluate the condition, if the value entered in a text field
is null, an alert message box is displayed with 'Name is empty'. Otherwise the
value entered by the user is assigned to array. The function show( )
include array. sort( ) method.
array. sort ( ) - The sort( ) is used to sort the element in an array. This
method sort the element by alphabetically.
The sorted array assigned to a string variable. The for loop run and execute
the script till the length of i is less than the count. The concatenated string and array
are assigned in variable string .
Finally if the array length is greater than 0,The code displays you the
sorted element stored from a string in your supporting browsers.
document.getElementById('myDiv').innerHTML - This return
you element of an array on the basis of the respective Id.
JavaScript array functions sort.html
<html>
<head>
<title>push function</title>
<script>
var array = new Array();
var count = 0;
function push(val){
if(val=="")
alert("Name is empty")
else {
array[count]=val;
count++;
}
}
function show() {
array.sort();
var string="<b>Sorted Array:</b><br>";
for(i = 0; i < count; i++) {
string =string+array[i]+"<br>";
}
if(array.length > 0)
document.getElementById('myDiv').innerHTML = string;
}
</script>
</head>
<body>
<h2>JavaScript Sort</h2>
<form name="form1">
<table width="407">
<tr>
<td width="154" align="right"><b>Name</b></td>
<td width="9"><b> :</b></td>
<td width="224">
<input type="text" name="name"/></td>
</tr>
<tr>
<td width="154" align="right"> </td>
<td width="9"> </td>
<td width="224"> </td>
</tr>
<tr>
<td width="154" align="right"> </td>
<td width="9"> </td>
<td width="224">
<input type="button" Value="Insert And Sort"
onclick="push(this.form.name.value),show();"/>
</td>
</tr>
</table>
</form>
<div id="myDiv"></div>
</body>
</html>
|
Output

After insert value:

Download Code

|