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>&nbsp;:</b></td>

                    <td width="224">

                    <input type="text" name="name"/></td>

                </tr>

                <tr>

                    <td width="154" align="right">&nbsp;</td>

                    <td width="9">&nbsp;</td>

                    <td width="224">&nbsp;</td>

                </tr>

                <tr>

                    <td width="154" align="right">&nbsp;</td>

                    <td width="9">&nbsp;</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