Showing all tasks in javascript

Question

3.00/5 (1 vote)

See more:

I am trying to make a to-do list form. I want each task to show up at the bottom not just one. How do I do this? Here is my js

C#

function Task(name, priority) {
    'use strict';
    this.name = name;
    this.priority = priority;
    this.completed = false;
    this.toString = function() {
        return this.name + ' (' + this.priority + ')';
            };
} // End of Task function.
window.onload = function(){
    'use strict';
    var task = document.getElementById('task');
    var priority = document.getElementById('priority');
    var output = document.getElementById('output');
    var tasks = [];
    document.getElementById('theForm').onsubmit = function() {
        var t = new Task(task.value, priority.value);
        tasks.push(t);
        output.innerHTML = 'There are now <b>' + tasks.length + '</b> item(s) in the to-do list. Just added:<br>' + t.toString();
            return false;
            function expSub() {
                expandSubtitle('output.innerHTML')
            }
    }; // End of onsubmit anonymous function.
}; // End of onload anonymous function.

Any suggestions would be helpful! Thanks!

Posted 15-Oct-13 10:22am

Member 10338301

Add a Solution

Comments

Sergey Alexandrovich Kryukov 15-Oct-13 16:44pm

It's not clear where the task data comes from and how the results should look. Remember though that all id values should be unique on the page. So what, do you have only one of each elements with id "task", "priority", "output" and "theForm"?
—SA

Member 10338301 21-Oct-13 9:56am

Im sorry I am very new at this. I have a form now that works good. What I wat it to do is instead of listing just the updated task on the to-do form I would like all of the tasks to show up. Here Is My Html and javascript.

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>To-Do List</title>

<link rel="stylesheet" href="css/form.css">
</head>
<body>

<form action="#" method="post" id="theForm">
<fieldset>Enter an Item To Be Done
<div><label for="task">Task</label><input type="text" name="task" id="task" required></div>
<div><label for="priority">Priority</label> <select name="priority" id="priority">
<option value="high">High</option>
<option value="normal" selected>Normal</option>
<option value="low">Low</option>
</select></div>
<input type="submit" value="Add It!" id="submit">
<div id="output"></div>
</fieldset>
</form>
<script src="js/tasks.js"></script>
</body>
</html>

function Task(name, priority) {
'use strict';
this.name = name;
this.priority = priority;
this.completed = false;
this.toString = function() {
return this.name + ' (' + this.priority + ')';
};
}
window.onload = function(){
'use strict';
var task = document.getElementById('task');
var priority = document.getElementById('priority');
var output = document.getElementById('output');
var tasks = [];
document.getElementById('theForm').onsubmit = function() {
var t = new Task(task.value, priority.value);
tasks.push(t);
output.innerHTML = 'There are now ' + tasks.length + ' item(s) in the to-do list. Just added:<br>' + t.toString();
return false;
function expSub() {
expandSubtitle('output.innerHTML')

} } // End of onsubmit anonymous function.
}; // End of onload anonymous function.

Thank you!

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Showing all tasks in javascript

Add your solution here

Preview 0

Showing all tasks in javascript

Add your solution here

Preview 0

Existing Members

...or Join us