Node won't Populate JavaScript











up vote
0
down vote

favorite












I am working on a Node List that will populate as the user creates new tasks. I can not get the Node to populate its values, and it is keeping me from making any progress. Anything I look up for help does not give any help unless its Premade values in the code. Not sure why and trying to get help from my professor is like talking to a brick wall.



my JavaScript



function Node() {
this.task = document.getElementById('task').value;
this.priority = document.getElementById('priority');
this.owner = function () {
if (Math.random() > .5) {
return 'Bob';
} else {
return 'Joe';
}
};
this.next = null;
}

function SLinkedList() {
this.head = null;

this.append = function() {
var node = new Node();
var checkNode = this.head;
if (!checkNode) {
this.head = node;
return node;
} else {
var tail = this.findTail(this.head);
tail.next = node;
}
};

this.findTail = function (currentNode) {
if (currentNode.next === null) {
return currentNode;
} else {
return this.findTail(currentNode.next);
}
};

document.getElementById('item-output').innerHTML = "Item added. Task: " `+ Node.task + " Priority: " + Node.priority + "Owner: " + Node.owner;`
}

//unfinished to display all items because node won't populate
function displayItems() {
this.getTasks = function(node, tasks) {

}
}

var myList = new SLinkedList();

console.log(myList.head);


my HTML



<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Linked List</title>
<link rel="stylesheet" href="linkedList.css">
<script type="text/javascript" src="linkedList.js" defer></script>
</head>
<body>
<br />
<form id="theForm">
<fieldset>
<legend>
Enter a (Business) Item To Be Done
</legend>
<div>
<label for="task">Task:</label>
</div>
<div>
<input type="text" name="task" id="task" required="required">
</div>
<div>
<label for="task">Priority:</label>
</div>
<div>
<select name="priority" id="priority" required="required">
<option value="high">high</option>
<option value="medium">medium</option>
<option value="low">low</option>
</select>
</div>

<div>
<input type="button" onclick="SLinkedList()" value="Add it!" >
</div>
<div id="item-output"></div>
</fieldset>
<fieldset>
<legend>
Display All (Business) Items
</legend>
<div>
<input type="button" value="Display All Items" onclick="displayItems()">
</div>
<div id="all-items"></div>
</fieldset>
</form>
</body>
</html>


This is an assignment, but unforutnately this Professor has been very unhelpful all semester and even admitted that he hasn't touched much code since the early 90's. I think my University is screwing us over with uneducated teachers. Here is his requirements if it helps clear up any confusion.



While much of the code in JsBin Linked List (Links to an external site.)Links to an external site. can be reused, you will need to make a few modifications. These include:




  1. Create a new empty item list object with the SLinkedList function when the page initially loads.

  2. In the original code the Node object uses this.value. Replace it with this.task and this.priority and this.owner, etc so that it has the same attributes as an item object in the last assignment.

  3. In the original code when a new linked list object is created with the SLinkedList function it adds an initial node to this.head. In the new code this.head should be null.

  4. Modify the append method so when it appends, it checks to see whether the head node is null. If it is null append the new item to the head. Otherwise append to the end of the linked list.

  5. In the original function named displayitems() take out almost all of the code and have it call a new function named getTasks(node,tasks). This new function uses the same recursive approach used in gettail() (e.g. it calls itself) to walk through the nodes in the linked list. The function's first parameter is the head node of the linked list. The second parameter is an empty string. As the recursive function calls itself and traverses the linked list add to the tasks string with the task, priority and owner values in each node. After the traverse completes return the tasks string to displayItems(). displayItems() can then use the string to write the items (and appropriate html) to the DOM.










share|improve this question


























    up vote
    0
    down vote

    favorite












    I am working on a Node List that will populate as the user creates new tasks. I can not get the Node to populate its values, and it is keeping me from making any progress. Anything I look up for help does not give any help unless its Premade values in the code. Not sure why and trying to get help from my professor is like talking to a brick wall.



    my JavaScript



    function Node() {
    this.task = document.getElementById('task').value;
    this.priority = document.getElementById('priority');
    this.owner = function () {
    if (Math.random() > .5) {
    return 'Bob';
    } else {
    return 'Joe';
    }
    };
    this.next = null;
    }

    function SLinkedList() {
    this.head = null;

    this.append = function() {
    var node = new Node();
    var checkNode = this.head;
    if (!checkNode) {
    this.head = node;
    return node;
    } else {
    var tail = this.findTail(this.head);
    tail.next = node;
    }
    };

    this.findTail = function (currentNode) {
    if (currentNode.next === null) {
    return currentNode;
    } else {
    return this.findTail(currentNode.next);
    }
    };

    document.getElementById('item-output').innerHTML = "Item added. Task: " `+ Node.task + " Priority: " + Node.priority + "Owner: " + Node.owner;`
    }

    //unfinished to display all items because node won't populate
    function displayItems() {
    this.getTasks = function(node, tasks) {

    }
    }

    var myList = new SLinkedList();

    console.log(myList.head);


    my HTML



    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>Linked List</title>
    <link rel="stylesheet" href="linkedList.css">
    <script type="text/javascript" src="linkedList.js" defer></script>
    </head>
    <body>
    <br />
    <form id="theForm">
    <fieldset>
    <legend>
    Enter a (Business) Item To Be Done
    </legend>
    <div>
    <label for="task">Task:</label>
    </div>
    <div>
    <input type="text" name="task" id="task" required="required">
    </div>
    <div>
    <label for="task">Priority:</label>
    </div>
    <div>
    <select name="priority" id="priority" required="required">
    <option value="high">high</option>
    <option value="medium">medium</option>
    <option value="low">low</option>
    </select>
    </div>

    <div>
    <input type="button" onclick="SLinkedList()" value="Add it!" >
    </div>
    <div id="item-output"></div>
    </fieldset>
    <fieldset>
    <legend>
    Display All (Business) Items
    </legend>
    <div>
    <input type="button" value="Display All Items" onclick="displayItems()">
    </div>
    <div id="all-items"></div>
    </fieldset>
    </form>
    </body>
    </html>


    This is an assignment, but unforutnately this Professor has been very unhelpful all semester and even admitted that he hasn't touched much code since the early 90's. I think my University is screwing us over with uneducated teachers. Here is his requirements if it helps clear up any confusion.



    While much of the code in JsBin Linked List (Links to an external site.)Links to an external site. can be reused, you will need to make a few modifications. These include:




    1. Create a new empty item list object with the SLinkedList function when the page initially loads.

    2. In the original code the Node object uses this.value. Replace it with this.task and this.priority and this.owner, etc so that it has the same attributes as an item object in the last assignment.

    3. In the original code when a new linked list object is created with the SLinkedList function it adds an initial node to this.head. In the new code this.head should be null.

    4. Modify the append method so when it appends, it checks to see whether the head node is null. If it is null append the new item to the head. Otherwise append to the end of the linked list.

    5. In the original function named displayitems() take out almost all of the code and have it call a new function named getTasks(node,tasks). This new function uses the same recursive approach used in gettail() (e.g. it calls itself) to walk through the nodes in the linked list. The function's first parameter is the head node of the linked list. The second parameter is an empty string. As the recursive function calls itself and traverses the linked list add to the tasks string with the task, priority and owner values in each node. After the traverse completes return the tasks string to displayItems(). displayItems() can then use the string to write the items (and appropriate html) to the DOM.










    share|improve this question
























      up vote
      0
      down vote

      favorite









      up vote
      0
      down vote

      favorite











      I am working on a Node List that will populate as the user creates new tasks. I can not get the Node to populate its values, and it is keeping me from making any progress. Anything I look up for help does not give any help unless its Premade values in the code. Not sure why and trying to get help from my professor is like talking to a brick wall.



      my JavaScript



      function Node() {
      this.task = document.getElementById('task').value;
      this.priority = document.getElementById('priority');
      this.owner = function () {
      if (Math.random() > .5) {
      return 'Bob';
      } else {
      return 'Joe';
      }
      };
      this.next = null;
      }

      function SLinkedList() {
      this.head = null;

      this.append = function() {
      var node = new Node();
      var checkNode = this.head;
      if (!checkNode) {
      this.head = node;
      return node;
      } else {
      var tail = this.findTail(this.head);
      tail.next = node;
      }
      };

      this.findTail = function (currentNode) {
      if (currentNode.next === null) {
      return currentNode;
      } else {
      return this.findTail(currentNode.next);
      }
      };

      document.getElementById('item-output').innerHTML = "Item added. Task: " `+ Node.task + " Priority: " + Node.priority + "Owner: " + Node.owner;`
      }

      //unfinished to display all items because node won't populate
      function displayItems() {
      this.getTasks = function(node, tasks) {

      }
      }

      var myList = new SLinkedList();

      console.log(myList.head);


      my HTML



      <!DOCTYPE html>
      <html lang="en">
      <head>
      <meta charset="UTF-8">
      <title>Linked List</title>
      <link rel="stylesheet" href="linkedList.css">
      <script type="text/javascript" src="linkedList.js" defer></script>
      </head>
      <body>
      <br />
      <form id="theForm">
      <fieldset>
      <legend>
      Enter a (Business) Item To Be Done
      </legend>
      <div>
      <label for="task">Task:</label>
      </div>
      <div>
      <input type="text" name="task" id="task" required="required">
      </div>
      <div>
      <label for="task">Priority:</label>
      </div>
      <div>
      <select name="priority" id="priority" required="required">
      <option value="high">high</option>
      <option value="medium">medium</option>
      <option value="low">low</option>
      </select>
      </div>

      <div>
      <input type="button" onclick="SLinkedList()" value="Add it!" >
      </div>
      <div id="item-output"></div>
      </fieldset>
      <fieldset>
      <legend>
      Display All (Business) Items
      </legend>
      <div>
      <input type="button" value="Display All Items" onclick="displayItems()">
      </div>
      <div id="all-items"></div>
      </fieldset>
      </form>
      </body>
      </html>


      This is an assignment, but unforutnately this Professor has been very unhelpful all semester and even admitted that he hasn't touched much code since the early 90's. I think my University is screwing us over with uneducated teachers. Here is his requirements if it helps clear up any confusion.



      While much of the code in JsBin Linked List (Links to an external site.)Links to an external site. can be reused, you will need to make a few modifications. These include:




      1. Create a new empty item list object with the SLinkedList function when the page initially loads.

      2. In the original code the Node object uses this.value. Replace it with this.task and this.priority and this.owner, etc so that it has the same attributes as an item object in the last assignment.

      3. In the original code when a new linked list object is created with the SLinkedList function it adds an initial node to this.head. In the new code this.head should be null.

      4. Modify the append method so when it appends, it checks to see whether the head node is null. If it is null append the new item to the head. Otherwise append to the end of the linked list.

      5. In the original function named displayitems() take out almost all of the code and have it call a new function named getTasks(node,tasks). This new function uses the same recursive approach used in gettail() (e.g. it calls itself) to walk through the nodes in the linked list. The function's first parameter is the head node of the linked list. The second parameter is an empty string. As the recursive function calls itself and traverses the linked list add to the tasks string with the task, priority and owner values in each node. After the traverse completes return the tasks string to displayItems(). displayItems() can then use the string to write the items (and appropriate html) to the DOM.










      share|improve this question













      I am working on a Node List that will populate as the user creates new tasks. I can not get the Node to populate its values, and it is keeping me from making any progress. Anything I look up for help does not give any help unless its Premade values in the code. Not sure why and trying to get help from my professor is like talking to a brick wall.



      my JavaScript



      function Node() {
      this.task = document.getElementById('task').value;
      this.priority = document.getElementById('priority');
      this.owner = function () {
      if (Math.random() > .5) {
      return 'Bob';
      } else {
      return 'Joe';
      }
      };
      this.next = null;
      }

      function SLinkedList() {
      this.head = null;

      this.append = function() {
      var node = new Node();
      var checkNode = this.head;
      if (!checkNode) {
      this.head = node;
      return node;
      } else {
      var tail = this.findTail(this.head);
      tail.next = node;
      }
      };

      this.findTail = function (currentNode) {
      if (currentNode.next === null) {
      return currentNode;
      } else {
      return this.findTail(currentNode.next);
      }
      };

      document.getElementById('item-output').innerHTML = "Item added. Task: " `+ Node.task + " Priority: " + Node.priority + "Owner: " + Node.owner;`
      }

      //unfinished to display all items because node won't populate
      function displayItems() {
      this.getTasks = function(node, tasks) {

      }
      }

      var myList = new SLinkedList();

      console.log(myList.head);


      my HTML



      <!DOCTYPE html>
      <html lang="en">
      <head>
      <meta charset="UTF-8">
      <title>Linked List</title>
      <link rel="stylesheet" href="linkedList.css">
      <script type="text/javascript" src="linkedList.js" defer></script>
      </head>
      <body>
      <br />
      <form id="theForm">
      <fieldset>
      <legend>
      Enter a (Business) Item To Be Done
      </legend>
      <div>
      <label for="task">Task:</label>
      </div>
      <div>
      <input type="text" name="task" id="task" required="required">
      </div>
      <div>
      <label for="task">Priority:</label>
      </div>
      <div>
      <select name="priority" id="priority" required="required">
      <option value="high">high</option>
      <option value="medium">medium</option>
      <option value="low">low</option>
      </select>
      </div>

      <div>
      <input type="button" onclick="SLinkedList()" value="Add it!" >
      </div>
      <div id="item-output"></div>
      </fieldset>
      <fieldset>
      <legend>
      Display All (Business) Items
      </legend>
      <div>
      <input type="button" value="Display All Items" onclick="displayItems()">
      </div>
      <div id="all-items"></div>
      </fieldset>
      </form>
      </body>
      </html>


      This is an assignment, but unforutnately this Professor has been very unhelpful all semester and even admitted that he hasn't touched much code since the early 90's. I think my University is screwing us over with uneducated teachers. Here is his requirements if it helps clear up any confusion.



      While much of the code in JsBin Linked List (Links to an external site.)Links to an external site. can be reused, you will need to make a few modifications. These include:




      1. Create a new empty item list object with the SLinkedList function when the page initially loads.

      2. In the original code the Node object uses this.value. Replace it with this.task and this.priority and this.owner, etc so that it has the same attributes as an item object in the last assignment.

      3. In the original code when a new linked list object is created with the SLinkedList function it adds an initial node to this.head. In the new code this.head should be null.

      4. Modify the append method so when it appends, it checks to see whether the head node is null. If it is null append the new item to the head. Otherwise append to the end of the linked list.

      5. In the original function named displayitems() take out almost all of the code and have it call a new function named getTasks(node,tasks). This new function uses the same recursive approach used in gettail() (e.g. it calls itself) to walk through the nodes in the linked list. The function's first parameter is the head node of the linked list. The second parameter is an empty string. As the recursive function calls itself and traverses the linked list add to the tasks string with the task, priority and owner values in each node. After the traverse completes return the tasks string to displayItems(). displayItems() can then use the string to write the items (and appropriate html) to the DOM.







      javascript frontend nodelist






      share|improve this question













      share|improve this question











      share|improve this question




      share|improve this question










      asked Nov 11 at 22:55









      J_Roost312

      96




      96





























          active

          oldest

          votes











          Your Answer






          StackExchange.ifUsing("editor", function () {
          StackExchange.using("externalEditor", function () {
          StackExchange.using("snippets", function () {
          StackExchange.snippets.init();
          });
          });
          }, "code-snippets");

          StackExchange.ready(function() {
          var channelOptions = {
          tags: "".split(" "),
          id: "1"
          };
          initTagRenderer("".split(" "), "".split(" "), channelOptions);

          StackExchange.using("externalEditor", function() {
          // Have to fire editor after snippets, if snippets enabled
          if (StackExchange.settings.snippets.snippetsEnabled) {
          StackExchange.using("snippets", function() {
          createEditor();
          });
          }
          else {
          createEditor();
          }
          });

          function createEditor() {
          StackExchange.prepareEditor({
          heartbeatType: 'answer',
          autoActivateHeartbeat: false,
          convertImagesToLinks: true,
          noModals: true,
          showLowRepImageUploadWarning: true,
          reputationToPostImages: 10,
          bindNavPrevention: true,
          postfix: "",
          imageUploader: {
          brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
          contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
          allowUrls: true
          },
          onDemand: true,
          discardSelector: ".discard-answer"
          ,immediatelyShowMarkdownHelp:true
          });


          }
          });














          draft saved

          draft discarded


















          StackExchange.ready(
          function () {
          StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53254063%2fnode-wont-populate-javascript%23new-answer', 'question_page');
          }
          );

          Post as a guest















          Required, but never shown






























          active

          oldest

          votes













          active

          oldest

          votes









          active

          oldest

          votes






          active

          oldest

          votes
















          draft saved

          draft discarded




















































          Thanks for contributing an answer to Stack Overflow!


          • Please be sure to answer the question. Provide details and share your research!

          But avoid



          • Asking for help, clarification, or responding to other answers.

          • Making statements based on opinion; back them up with references or personal experience.


          To learn more, see our tips on writing great answers.





          Some of your past answers have not been well-received, and you're in danger of being blocked from answering.


          Please pay close attention to the following guidance:


          • Please be sure to answer the question. Provide details and share your research!

          But avoid



          • Asking for help, clarification, or responding to other answers.

          • Making statements based on opinion; back them up with references or personal experience.


          To learn more, see our tips on writing great answers.




          draft saved


          draft discarded














          StackExchange.ready(
          function () {
          StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53254063%2fnode-wont-populate-javascript%23new-answer', 'question_page');
          }
          );

          Post as a guest















          Required, but never shown





















































          Required, but never shown














          Required, but never shown












          Required, but never shown







          Required, but never shown

































          Required, but never shown














          Required, but never shown












          Required, but never shown







          Required, but never shown







          Popular posts from this blog

          Florida Star v. B. J. F.

          Danny Elfman

          Lugert, Oklahoma