Question: 3. (9 marks) Write the code for the sendNewItem(newItem) function in the todo.js file. This function must send the newly created item to the server

3. (9 marks) Write the code for the sendNewItem(newItem) function in the todo.js file. This function must send the newly created item to the server so the list of items may be updated. If successful, the item should be added to the clients list of items and the display must be updated. If not successful, then client-side updates do not occur.

3. (9 marks) Write the code for the sendNewItem(newItem) function in thetodo.js file. This function must send the newly created item to the

Contents of todo.js: let items = []; function init(){ document.getElementById("additem").addEventListener("click", addItem); setInterval(refreshList, 5000); function refreshList({ req = new XMLHttpRequest(); req.onreadystatechange = function() { if(this.readyState==4 && this.status== 200){ items = JSON.parse(req.responseText).items; renderlist(); req.open("GET", 'http://localhost:3000/list); req.send(); //Creates a new item and calls function to send the item to the server function addItem() { let itemName = document.getElementById("itemname").value; if(itemName.length == 0){ alert("You must enter an item name."); return; sendNewItem({name: itemName}); //Continues on next page... function sendNewItem(newItem){ //Your code would go here. //Removes displayed list data and renders new list using contents of items function renderList() { let list = document.getElementById("list"); while(list. firstChild) { list.removeChild(list. firstChild); items.forEach(elem => { let newDiv = document.createElement("div"); let newItem = document.createElement("input"); newItem.type = "checkbox"; newItem.value = elem.name; newItem.id = elem.name; let text = document.createTextNode(elem.name); newDiv.appendChild(newItem); newDiv.appendChild(text); list.appendChild(newDiv)

Step by Step Solution

There are 3 Steps involved in it

1 Expert Approved Answer
Step: 1 Unlock blur-text-image
Question Has Been Solved by an Expert!

Get step-by-step solutions from verified subject matter experts

Step: 2 Unlock
Step: 3 Unlock

Students Have Also Explored These Related Databases Questions!