javascript to do list
<p>I want to create a on-page userinterface that displays an empty todo list and contains a form that allows users to enter a task to add to their to-do list. the task should be displayed in the list immediately after a user add them, without a page reload.</p>

<p>Requirement is the form should have</p>

<ol>
<li>input box to enter the title of their task</li>
<li>the way for the user to select a priority level for their task</li>
<li>an add task button</li>
</ol>

<p>the list
. should display each task ,title and priority entered by user
. should have a way to mark a task as 'complete'
. ability to sort list based on priority and complete status</p>

<p>below is mycode</p>

<pre><code>&lt;HEAD&gt;
    &lt;TITLE&gt;Test Input&lt;/TITLE&gt;

 &lt;script type="text/javascript"&gt;
      function addtext()
      {
         var newtext = document.myform.inputbox.value;
         document.getElementById('tableID').innerHTML.add = newtext;
      }
    &lt;/script&gt;



  &lt;/HEAD&gt;
  &lt;BODY&gt;

    &lt;TABLE id="dataTable" width="350px" border="1"&gt;   
     &lt;TR&gt;           
 &lt;TD&gt;&lt;INPUT type="checkbox" name="chk"/&gt;
&lt;/TD&gt;            
&lt;TD&gt;&lt;INPUT type="text" name="inputbox" value ="inputbox"javascript:addtext()/&gt;&lt;/TD&gt; 
  &lt;TD&gt;&lt;SELECT name="country"&gt;     
       &lt;OPTION value="in"&gt;High&lt;/OPTION&gt;             
       &lt;OPTION value="de"&gt;Medium&lt;/OPTION&gt;                   
       &lt;OPTION value="ch"&gt;Low&lt;/OPTION&gt;     
        &lt;/SELECT&gt;

     &lt;/TD&gt;
     &lt;/TR&gt; 


 &lt;/TABLE&gt;

&lt;INPUT type="button" value="Add Row" onclick="addRow('dataTable')" /&gt;
&lt;SCRIPT language="javascript"&gt;  
function addRow(tableID) { 
 var table = document.getElementById(tableID); 
  var rowCount = table.rows.length;   
   var row = table.insertRow(rowCount);     
   var colCount = table.rows[0].cells.length;    
   for(var i=0; i&lt;colCount; i++) {              
   var newcell = row.insertCell(i);  
               newcell.innerHTML = table.rows[0].cells[i].innerHTML; 
               //alert(newcell.childNodes);    
            switch(newcell.childNodes[0].type) {   
                 case "text":  
                          newcell.childNodes[0].value = "";
                            break; 
                   case "checkbox":  
                          newcell.childNodes[0].checked = false;    
                        break;                    case "select-one": 
                           newcell.childNodes[0].selectedIndex = 0;
                            break;

                } 
           }     
   }
    &lt;/script&gt;
 &lt;/BODY&gt;


    &lt;/DIV&gt;

&lt;/HTML&gt;
</code></pre>
