By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
424,952 Members | 1,732 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 424,952 IT Pros & Developers. It's quick & easy.

javascript sorting program in html

P: 11
dear all...please help me...i want a program in java script...which has only a text box in which we enter a numbers or string seperated by comma ....should be sorted and values to be displayed...please any body write program for me...i am not getting it...pzz..anybody help...
Jul 13 '15 #1
Share this Question
Share on Google+
20 Replies


Dormilich
Expert Mod 5K+
P: 8,639
what have you tried?
Jul 13 '15 #2

P: 11
actually i dnt know getting how to get values frm single text box and put in array and sort and display...pls help...if u know
Jul 13 '15 #3

Dormilich
Expert Mod 5K+
P: 8,639
getting the textbox value is simple:
Expand|Select|Wrap|Line Numbers
  1. var value = <textbox>.value;
note that <textbox> stands for a reference to the textbox element. (so plain copy/past won’t work)

the functions you’ll likely use next are String.split() and Array.sort().
Jul 13 '15 #4

P: 11
i want to get multiple numbers from single text box...and sort it manually...pls wilu do d pgm for mee...
Jul 13 '15 #5

Dormilich
Expert Mod 5K+
P: 8,639
np ;)
Jul 13 '15 #6

P: 11
Expand|Select|Wrap|Line Numbers
  1. <html>
  2. <head>
  3. <title>
  4. Sorting Numbers....!!!!!
  5. </title>
  6. <script type="text/javascript">
  7. var myArray = [];
  8. function bubblesort()
  9. {
  10. var inputValue = document.getElementById("valueField");
  11. for (var i = 0; i < inputValue.value; ++i)
  12. {
  13. inputValue.innerHTML = "";
  14. myArray[i] = document.getElementById("valueField").value;
  15. }
  16. var length=myArray.length;
  17. var returnArray=new Array(length);
  18. for (var i =0; i < (arrayToSort.length-1); i = i+1)
  19. {        
  20.  
  21. if ((arrayToSort[i+1]) < (arrayToSort[i]))
  22. {
  23.  
  24. var temp = arrayToSort[i+1];
  25. arrayToSort[i+1] = arrayToSort[i];
  26. arrayToSort[i] = temp;
  27.  
  28. }
  29.  
  30. }
  31. return returnArray;
  32.  
  33.  
  34.  
  35. </script>
  36. </head>
  37. <body>
  38. <form>
  39. Enter number of values:
  40. <input id="valueField" type="number">
  41. <input id="submitButton" value="Submit" type="button">
  42. </form>
  43.  
  44. </body>
  45. </html>

this is what so far i did...plzzz help....

any corrections and further completion
Jul 13 '15 #7

Dormilich
Expert Mod 5K+
P: 8,639
#1 input fields do not have an innerHTML property. they’re empty elements.

#2 why creating an explicit bubblesort implementation? doesn’t the native sort work for you?

#3 on line 11 you treat the input as a max value. on line 14 you put the same value that many times in an array, i.e. you get an array of size n with the number n as each element. due to that the sorting afterwards does not make any sense.

#4 if your input is not a single number (e.g. a comma-separated list of numbers) your code will bail out due to impossible number conversion (i.e. resulting in NaN (not a number))
Jul 13 '15 #8

P: 11
pls..will u write the pgm for me??/plss...
Jul 13 '15 #9

Dormilich
Expert Mod 5K+
P: 8,639
np ;)
Jul 14 '15 #10

P: 11
np means??//anybody...pls helppp..........
Jul 14 '15 #11

Dormilich
Expert Mod 5K+
P: 8,639
it's short for nope (I mean, you’re abbreviating words as well, so why shouldn’t I?). we will not do the work for you, but we will help you with problems you encounter.
Jul 14 '15 #12

P: 11
hmm...i dnt know dats y...is there any other place...where i can get the required program
Jul 14 '15 #13

P: 11
pls tell me how to get input value numbers from one input texbox and get them into array
Jul 14 '15 #14

Dormilich
Expert Mod 5K+
P: 8,639
erm, I did that on post #4.
Jul 14 '15 #15

P: 11
are u telling that more than one number in an input box is invalid??
Jul 14 '15 #16

Dormilich
Expert Mod 5K+
P: 8,639
no, I tell you that your program logic is busted.
Jul 14 '15 #17

P: 11
Expand|Select|Wrap|Line Numbers
  1. <html>
  2. <head>
  3. <title>
  4. This is the real sorting.....
  5. </title>
  6. </head>
  7. <script type="text/javascript">
  8. var numbers= new array(6);
  9. function swap(i,j)
  10. {
  11.  
  12. }
  13. function selectionSort()
  14. {
  15.     var largest;
  16.     for (i=0; i<5; i++)
  17.     {
  18.         largest=0;
  19.         for (j=1; j< (6 - i); j++)
  20.         {
  21.                 if (numbers[largest] < numbers[j] )
  22.                 {
  23.                         largest=j;
  24.  
  25.                 }
  26.         }
  27.         swap( largest, (5-i) );
  28.  
  29.      }
  30. }
  31.  
  32.  
  33.  
  34. </script>
  35. <body bgcolor=pink>
  36. <form name="form1">
  37. <h1>Input Section</h1>
  38. <table>
  39. <tr>
  40. <th>0</th>
  41. <th>1</th>
  42. <th>2</th>
  43. <th>3</th>
  44. <th>4</th>
  45. <th>5</th>
  46.  
  47. </tr>
  48. <tr>
  49. <td>
  50. <input type="text" name="i0" size="4">
  51. </td>
  52. <td>
  53. <input type="text" name="i1" size="4">
  54. </td>
  55. <td>
  56. <input type="text" name="i2" size="4">
  57. </td>
  58. <td>
  59. <input type="text" name="i3" size="4">
  60. </td>
  61. <td>
  62. <input type="text" name="i4" size="4">
  63. </td>
  64. <td>
  65. <input type="text" name="i5" size="4">
  66. </td>
  67.  
  68. </tr>
  69. </table>
  70.  
  71.  
  72. <input type=button value="Sort" name="selSort"
  73. onClick="sort()">
  74. <h1>Output Section</h1>
  75. Once you click on the sort button above, the numbers in boxes will be sorted
  76. accordingly and then be placed in these boxes.
  77. <table>
  78. <tr>
  79. <td>
  80. <input type="text" name="o0" size="4">
  81. </td>
  82. <td>
  83. <input type="text" name="o1" size="4">
  84. </td>
  85. <td>
  86. <input type="text" name="o2" size="4">
  87. </td>
  88. <td>
  89. <input type="text" name="o3" size="4">
  90. </td>
  91. <td>
  92. <input type="text" name="o4" size="4">
  93. </td>
  94. <td>
  95. <input type="text" name="o5" size="4">
  96. </td>
  97.  
  98. </tr>
  99. </table>
  100.  
  101.  
  102. </form>
  103.  
  104. </body>
  105. </html>
pls tell any corrections...and how to complete the pgm
Jul 14 '15 #18

Dormilich
Expert Mod 5K+
P: 8,639
why do you insist on creating your own sort() implementation?
Jul 14 '15 #19

P: 11
i hav to do it without built in functions....thatsy............
Jul 14 '15 #20

Dormilich
Expert Mod 5K+
P: 8,639
that would have been nice to know in the first place …

anyways, the first thing to do is analysing the current problems.

- #1 is the conversion from an input to an array
- #2 is the sorting of the array

what you need to do is solve each problem separately instead of trying all at once.

there are different approaches you could do.

- make a temporary page that only concerns with a single problem. i.e. you completely neglect problem #2 while working on #1 (and vice versa)

- mock all other problems while working on one. i.e. use use Array.sort() while working on problem #1 and use a predefined array as input while working on problem #2.
Jul 14 '15 #21

Post your reply

Sign in to post your reply or Sign up for a free account.