2010-06-09 5 views
1

Je travaille sur une mission de classe dans laquelle je dois accomplir ce qui suit:Tri d'une liste des éléments à l'aide javascript

1 Types d'utilisateurs une liste des éléments dans une zone de texte (champ de formulaire) 2 Lorsque l'utilisateur appuie sur le bouton de tri, la liste dans la zone de texte est triée 3 Il prend le texte de la zone de texte et replace le texte trié dans la zone de texte

Aidez-nous!

edit: c'est ce que j'ai jusqu'ici, ça ne marche pas. Merci les gars.

<script type="text/javascript"> 
    function addName() 
    { 
    var name2add = document.nameForm.newName.value; 
    // is the name 1-15 characters in length? 
    if (name2add.length > 15 || name2add.length == 0) 
    { 
     // no, warn the user 
     alert("Name must be between 1 and 15 characters long."); 
     // put the focus and selection back in the name text box 
     document.nameForm.newName.focus(); 
     document.nameForm.newName.select(); 
    } else { 
     theSelect = document.nameForm.nameList; 
     newVal = theSelect.options.length; 
     //alert(name2add + " will be #" + newVal); 
     // crate the new Option object to insert into the list 
     var newOption = new Option(name2add,newVal); 
     // insert the new option into the list 
     theSelect.options[newVal] = newOption; 
     // clear out the name text field and return the focus there 
     document.nameForm.newName.value = ""; 
     document.nameForm.newName.focus(); 
    } 
    return; 
    } 
    function deleteName() 
    { 
     var theSelect = document.nameForm.nameList; 
     theSelect.options[theSelect.selectedIndex] = null; 
     return; 
    } 
    </script> 

    </head> 

    <body> 
    <form id="form4" name="nameForm" method="post" action=""> 
     <p> 
     <label> 
      <input type="text" name="newName" id="newName" /> 
     </label> 
     </p> 
     <p> 
      <input type="button" value="Add Name To List" name="addButton" id="addButton" onclick="addName()" /> 

     </p> 
     <p> 
     <label> 
      <select name="list" size="3" id="nameList" > 
      </select> 
     </label> 
     </p> 
    <p> 
    <INPUT TYPE="BUTTON" NAME="sort" VALUE=" Sort " 
    OnClick="sortOptions(document.nameForm.list)"> 
    </p> 
    <p> 
    <input type="button" value="Remove Name From List" name="deleteButton" id="deleteButton" onclick="deleteName()" /> 
    </p> 
    </form> 
+8

Tout code que vous avez actuellement serait utile pour vous aider. Comme nous ne sommes pas ici pour faire vos devoirs. –

+1

Faites vos devoirs vous-même - demandez quand vous êtes coincé - postez le code que vous avez écrit. Nous allons vous aider à faire vos devoirs; nous ne ferons pas vos devoirs pour vous. – Amarghosh

Répondre

0

Heureusement pour vous, Javascript fournit un algorithme de tri natif, donc vous n'avez pas à en écrire un vous-même. C'est array.sort(). Donc, en gros, obtenez le texte de la boîte de texte, placez le texte dans un tableau. Ensuite, exécutez .sort() sur le tableau; puis remettez-le dans la zone de texte. Pour obtenir le texte dans un tableau, vous pouvez utiliser string.split ("\ n"), s'il est séparé par des lignes, ou string.split (","), s'il est séparé par des virgules.

var itemsToSort = document.getElementById("text_box") 
var arrayToSort = itemsToSort.split("\n") 
arrayToSort.sort() 
document.getElementById("text_box").value = arrayToSort.join("\n") 

pour votre zone de texte avec l'ID "text_box".