Sorting logic for arranging a list

2019-09-15 07:01发布

I have made some changes with sorting because previous logic was just comparing the current value with the first index value. I am trying to compare with all the values.

Please go through the sorting logic I have just written for if a value is positive and kindly guide me with it.

<head>
    <script type="text/javascript" src="https://code.jquery.com/jquery-3.0.0.min.js"></script>
    <script>
    function myFunction() {
  var node = document.createElement("LI");
  var answer = document.getElementById("selectMe").value;
  var textboxvalue = document.getElementById("t1").value;
  if (answer == "positive") {
    var textnode = document.createTextNode(textboxvalue);
    node.appendChild(textnode);
    var p = document.getElementById("Positive").childNodes; // child Nodes of positive
  //sorting logic   
var p1= new array(100);
   p1=  document.getElementById("Positive").childNodes;
   var i;
var len= p1.length;
     for(i=0;i<len;i++){
     var preValue = p[i].innerHTML;
     if (preValue > textboxvalue) { // compare with previous positive value to insertbefore or append
        document.getElementById("Positive").insertBefore(node, p[1]);
      } else {
        document.getElementById("Positive").appendChild(node);
      }
     else {
      document.getElementById("Positive").appendChild(node);
    }    
      }
  } else if (answer == "negative") {
    var c = document.getElementById("negative").childNodes; // child Nodes of negative
    var textnode = document.createTextNode(textboxvalue);
    node.appendChild(textnode);

    if (c[1]) {
      var preValue = c[1].innerHTML;
      if (preValue > textboxvalue) { // compare with previous negative value to insertbefore or append
        document.getElementById("negative").insertBefore(node, c[1]);
      } else {
        document.getElementById("negative").appendChild(node);
      }
    } else {
      document.getElementById("negative").appendChild(node);
    }
  }

  //document.body.appendChild(node);
}

    </script>
</head>

<body>
    <h3> <strong> Javascript Test </strong></h3>
    <form name="myForm" id="myForm" method="post">
        <table>
            <tr>
                <td>
                    <label>Term: </label>
                </td>
                <td>
                    <input type="text" name="fname" id="t1"> </td>
            </tr>
            <br/>
            <tr>
                <td>
                    <label> Type:</label>
                </td>
                <td>
                    <select name="title" required id="selectMe">
                        <option value="">Choose:</option>
                        <option value="positive">Positive</option>
                        <option value="negative">Negative</option>
                    </select>
                    </select>
                </td>
                <tr>
                    <td>
                        <button onclick="myFunction()"> Onclick </button>
                    </td>
                </tr>
        </table>
    </form>
    <fieldset>
        <legend>See Result in this Section:</legend>
        <label> Positive </label>
        <ul id="Positive">
        </ul>
        <label> Negative </label>
        <ul id="negative">
        </ul>
    </fieldset>
    <script type="text/javascript">
        $("#myForm").submit(function(e) {
            e.preventDefault();
            if (validateForm()) {
                myFunction();
            }
        });
    </script>
</body>

</html>

1条回答
一纸荒年 Trace。
2楼-- · 2019-09-15 07:27

Loop through the array of child elements and compare each element and insertBefore or append the element

function myFunction() {
  var node = document.createElement("LI");
  var answer = document.getElementById("selectMe").value;
  var textboxvalue = document.getElementById("t1").value;
  if (answer == "positive") {
    var textnode = document.createTextNode(textboxvalue);
    node.appendChild(textnode);
    var p = document.getElementById("Positive").childNodes; // child Nodes of positive
    if (p[1]) {
      for (var i = 0; i < p.length; i++) {
        alert(i);
        var preValue = p[i].innerHTML;
        if (preValue > textboxvalue) { // compare with previous positive value to insertbefore or append
          document.getElementById("Positive").insertBefore(node, p[i]);
          break;
        } else {
          document.getElementById("Positive").appendChild(node);
        }
      }
    } else {
      document.getElementById("Positive").appendChild(node);
    }

  } else if (answer == "negative") {
    var c = document.getElementById("negative").childNodes; // child Nodes of negative
    var textnode = document.createTextNode(textboxvalue);
    node.appendChild(textnode);

    if (c[1]) {
      for (var i = 0; i < c.length; i++) {
        alert(i);
        var preValue = c[i].innerHTML;
        if (preValue > textboxvalue) { // compare with previous negative value to insertbefore or append
          document.getElementById("negative").insertBefore(node, c[i]);
          break;
        } else {
          document.getElementById("negative").appendChild(node);
        }
      }
    } else {
      document.getElementById("negative").appendChild(node);
    }
  }

  //document.body.appendChild(node);
}

http://codepen.io/nagasai/pen/ZOLyWZ

查看更多
登录 后发表回答