Esercizio 11 API
This commit is contained in:
66
JS_Esercizi 11 - API/todo_app/index.html
Normal file
66
JS_Esercizi 11 - API/todo_app/index.html
Normal file
@@ -0,0 +1,66 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="it">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Todo App - CRUD Operations</title>
|
||||
<link rel="stylesheet" href="styles.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<h1>✓ Todo App</h1>
|
||||
<p class="subtitle">Operazioni CRUD (Create, Read, Update, Delete)</p>
|
||||
|
||||
<div class="instructions">
|
||||
<h3>📝 Obiettivo dell'Esercizio</h3>
|
||||
<p>Dovrai implementare un'app TODO con tutte le operazioni CRUD:</p>
|
||||
<ol>
|
||||
<li><strong>Ricerca:</strong> Seleziona un utente dalla barra di ricerca</li>
|
||||
<li><strong>CREATE:</strong> Aggiungi nuovi todo per l'utente selezionato</li>
|
||||
<li><strong>READ:</strong> Visualizza i todo dell'utente</li>
|
||||
<li><strong>UPDATE:</strong> Segna come completato</li>
|
||||
<li><strong>DELETE:</strong> Elimina todo</li>
|
||||
</ol>
|
||||
</div>
|
||||
|
||||
<!-- Barra di ricerca utenti -->
|
||||
<div class="search-section">
|
||||
<h3>👤 Seleziona Utente</h3>
|
||||
<div class="search-container">
|
||||
<input
|
||||
type="text"
|
||||
id="userSearch"
|
||||
placeholder="Cerca un utente per nome..."
|
||||
autocomplete="off"
|
||||
>
|
||||
</div>
|
||||
<div class="suggestions" id="suggestions"></div>
|
||||
<div id="selectedUser" class="selected-user">Nessun utente selezionato</div>
|
||||
</div>
|
||||
|
||||
<!-- Input per aggiungere todo -->
|
||||
<div class="input-group">
|
||||
<input
|
||||
type="text"
|
||||
id="todoInput"
|
||||
placeholder="Aggiungi un nuovo todo..."
|
||||
onkeypress="if(event.key === 'Enter') addTodo()"
|
||||
>
|
||||
<button class="btn" onclick="addTodo()">Aggiungi</button>
|
||||
</div>
|
||||
|
||||
<div class="loading" id="loading">
|
||||
<div class="spinner"></div>
|
||||
<p>Caricamento...</p>
|
||||
</div>
|
||||
|
||||
<div class="todos-container" id="todosContainer">
|
||||
<!-- I todo verranno inseriti qui -->
|
||||
</div>
|
||||
|
||||
<a href="../index.html" class="back-button">← Torna al Hub</a>
|
||||
</div>
|
||||
|
||||
<script src="script.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user