Harjutuse lisamise-salvestamise näide

 <html>

  <head><title></title>
  </head>
  <body>
  <script src="jquery.js" type="text/javascript">
  </script>
  <script>

    var todostore;

    function change(i) {
      /* load fields */
      item = todostore[i];
            
      $("#editid").val(item.id);
      $("#esalvestaja").val(item.salvestaja);
      $("#etodoname").val(item.f0);
      $("#etododesc").val(item.f1);

    }

    function sendEditForm() {
      var url = "http://dijkstra.cs.ttu.ee/~irve/cgi-bin/ui/uuenda.py?table=t0";
      url += "&f0=" + $("#todoname").val();
      url += "&f1=" + $("#tododesc").val();
      
      $("#debug").html(url);
      $.getJSON(url, sendFormCallback);
      return false;

    }


    function renderTableCallback(todolist, textStatus, jqXHR) {
      

      todostore = todolist;
      if (todolist == 0 || todolist.length == 0) {
        $("#todotable").html("No results, add some; might be our error too, sorry.");
        return;
      }


      result ="<tr><th>Name</th><th>Description</th></tr>\n";

      for ( i=0; i < todolist.length; i++ ) {
        result += "<tr>";
        result += "<td>" + todolist[i].f0 + "</td>";
        result += "<td>" + todolist[i].f1 + "</td>";
        result += "<td><a href=\"javascript:change(" + i + ")\">[Muuda]</a></td>";
        result += "</tr>";
    }
    $("#todotable").html(result);

    }


    function renderTable() {
      $.getJSON("http://dijkstra.cs.ttu.ee/~irve/cgi-bin/ui/otsi.py?salvestaja=test@example.ee&table=t0&order=f0&direction=desc", renderTableCallback);
    }

    function sendFormCallback(status, textStatus, jqXHR) {
      if (status == 0 ) {
        $("#debug").html("Sending unsuccessful");
        return;
      }

      renderTable();

    }


    function sendForm() {
      var url = "http://dijkstra.cs.ttu.ee/~irve/cgi-bin/ui/salvesta.py?table=t0";
      url += "&salvestaja=" + $("#salvestaja").val();
      url += "&f0=" + $("#todoname").val();
      url += "&f1=" + $("#tododesc").val();
      
      /*$("#debug").html(url);*/
      $.getJSON(url, sendFormCallback);
      return false;
    }


    function sendEditForm() {
      var url = "http://dijkstra.cs.ttu.ee/~irve/cgi-bin/ui/uuenda.py?table=t0";
      url += "&salvestaja=" + $("#esalvestaja").val();
      url += "&f0=" + $("#etodoname").val();
      url += "&f1=" + $("#etododesc").val();
      url += "&id=" + $("#editid").val();
      
      $("#debug").html(url);
      $.getJSON(url, sendFormCallback); /* note shared function */
      return false;
    }




    $(document).ready( function() {

      renderTable();
      
    });


  </script>


  <form onsubmit="return sendForm();">
    <p>Insert item</p>
    <input id="id" type="hidden" value=""/><br />
    <input id="salvestaja" type="text" value="test@example.ee" /><br />
    <input id="todoname" type="text" placeholder="Todo name" /><br />
    <input id="tododesc" type="text" placeholder="Description" /><br />
    <input id="send" type="submit" value="Save"/><br />


  </form>

  <form onsubmit="return sendEditForm();">
    <p>Edit item</p>
    <input id="editid" type="hidden" value=""/><br />
    <input id="esalvestaja" type="text" value="test@example.ee" /><br />
    <input id="etodoname" type="text" placeholder="Todo name" /><br />
    <input id="etododesc" type="text" placeholder="Description" /><br />
    <input id="esend" type="submit" value="Save"/><br />
  </form>

  <div id="debug">
  </div>
  
  <table id="todotable">

  </table>

  </body>
</html>