52 lines
1.6 KiB
Plaintext
52 lines
1.6 KiB
Plaintext
<!DOCTYPE html>
|
|
|
|
<html>
|
|
<head>
|
|
<title>Ma todolist</title>
|
|
<style>
|
|
a {text-decoration: none; color: black;}
|
|
</style>
|
|
<script
|
|
src="https://code.jquery.com/jquery-3.3.1.min.js"
|
|
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
|
|
crossorigin="anonymous"></script>
|
|
|
|
<script>$(function(){
|
|
$("body").on("click", ".btnDel", function(e){
|
|
e.preventDefault();
|
|
$.get("/todo/supprimer/"+$(this).data("id"), function(data){
|
|
$("#todolist").load(window.location.href+" #toLoad");
|
|
});
|
|
return false;
|
|
});
|
|
$("#addTodo").submit(function(e){
|
|
e.preventDefault();
|
|
$.post("/todo/ajouter/", $("#addTodo").serialize(), function(data){
|
|
$("#todolist").load(window.location.href+" #toLoad");
|
|
});
|
|
return false ;
|
|
});
|
|
});</script>
|
|
</head>
|
|
|
|
<body>
|
|
<h1>Ma todolist</h1>
|
|
|
|
<ul id="todolist">
|
|
<div id="toLoad">
|
|
<% todolist.forEach(function(todo, index) { %>
|
|
<li><a href="/todo/supprimer/<%= index %>" data-id="<%= index %>" class="btnDel">✘</a> <%= todo %></li>
|
|
<% }); %>
|
|
</div>
|
|
</ul>
|
|
|
|
<form action="/todo/ajouter/" method="post" id="addTodo">
|
|
<p>
|
|
<label for="newtodo">Que dois-je faire ?</label>
|
|
<input type="text" name="newtodo" id="newtodo" autofocus />
|
|
<input type="submit" />
|
|
</p>
|
|
</form>
|
|
</body>
|
|
</html>
|