Web Analytics Made Easy -
StatCounter sort() & table cells - CodingForum

Announcement

Collapse
No announcement yet.

sort() & table cells

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • sort() & table cells

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    <script>
    window.onload = function(){
    		document.getElementById("t").innerHTML = "<table border='1' id='myTable'>" + "<tr><td>" + names.join("<tr><td>") + "</td></tr>" + "</table>";
    	}
    
    var names = ["Marble","Jarque","Dino","Pineapple"];
    
    function abc(){
    	if(document.getElementById('myTable').rows[0].cells[0].innerHTML==names[0]){names.sort()}
    	else if(document.getElementById('myTable').rows[0].cells[0].innerHTML==names[2]){names.sort().reverse()}
    	else {names.sort()}
    	document.getElementById("t").innerHTML = "<table border='1' id='myTable'>" + "<tr><td>" + names.join("<tr><td>") + "</td></tr>" + "</table>";
    
    	}
    
    </script>
    </head>
    <body>
    <div id="t"></div>
    <input type="button" value="sort" onclick="abc()" />
    </body>
    </html>
    First time sort: no problem
    But when it comes to the blue-highlighted parts
    It cannot do the sort().reserve()
    What's wrong with the codes?

  • #2
    After the sort Dino becomes rows[0].cells[0].

    Code:
    var names = ["Marble","Jarque","Dino","Pineapple"];
    
    function abc(){
    if(document.getElementById('myTable').rows[0].cells[0].innerHTML==names[0]){names.sort();alert (names[2])}  // Marble
    document.getElementById("t").innerHTML = "<table border='1' id='myTable'>" + "<tr><td>" + names.join("<tr><td>") + "</td></tr>" + "</table>";
    alert (document.getElementById('myTable').rows[0].cells[0].innerHTML)  // Dino
    if(document.getElementById('myTable').rows[0].cells[0].innerHTML==names[0]){names.sort().reverse()}
    else {names.sort()}
    document.getElementById("t").innerHTML = "<table border='1' id='myTable'>" + "<tr><td>" + names.join("<tr><td>") + "</td></tr>" + "</table>";
    }
    Last edited by Philip M; Aug 27, 2011, 08:21 AM.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

    Comment


    • #3
      Originally posted by Philip M View Post
      After the sort Dino becomes rows[0].cells[0].

      Code:
      var names = ["Marble","Jarque","Dino","Pineapple"];
      
      function abc(){
      if(document.getElementById('myTable').rows[0].cells[0].innerHTML==names[0]){names.sort();alert (names[2])}  // Marble
      document.getElementById("t").innerHTML = "<table border='1' id='myTable'>" + "<tr><td>" + names.join("<tr><td>") + "</td></tr>" + "</table>";
      alert (document.getElementById('myTable').rows[0].cells[0].innerHTML)  // Dino
      if(document.getElementById('myTable').rows[0].cells[0].innerHTML==names[0]){names.sort().reverse()}
      else {names.sort()}
      document.getElementById("t").innerHTML = "<table border='1' id='myTable'>" + "<tr><td>" + names.join("<tr><td>") + "</td></tr>" + "</table>";
      }
      Code:
      function abc(){
      	if(document.getElementById('myTable').rows[0].cells[0].innerHTML==names[0]){names.sort()}
      	else if(document.getElementById('myTable').rows[0].cells[0].innerHTML=="Dino"){names.sort().reverse()}
      	else {names.sort()}
      	document.getElementById("t").innerHTML = "<table border='1' id='myTable'>" + "<tr><td>" + names.join("<tr><td>") + "</td></tr>" + "</table>";
      }
      But why even I change it, it cannot do the sort().reverse()?

      Comment


      • #4
        When you run the sort method on a array, it changes the original array. Since you might want to use this function on different arrays, it isn't very efficient to test for the value of the first row. So when you want to toggle between ascending and descending it's best to keep the state in a variable.
        Code:
        function abc(){
         abc.sorted == null ? names.sort() : names.reverse();
         abc.sorted = true;
         document.getElementById("t").innerHTML = "<table border='1' id='myTable'>" + "<tr><td>" + names.join("<tr><td>") + "</td></tr>" + "</table>";
        };

        Comment


        • #5
          Thanks. I learn one more thing about the tenary operator and it's possible an array order can be changed.

          Comment

          Working...
          X