Menu
CoddyTech

Parciales de plantilla

Parte de la sección API JSON del Journey de Django de Coddy. Lección 14 de 19.

Un script no siempre quiere JSON. Después de añadir una tarea, puede pedirle al servidor el <li> ya preparado para esa tarea e insertarlo en la lista. Una plantilla ya dibuja esa fila, así que el servidor debería reutilizarla.

Django 6.0 añadió fragmentos de plantilla: una parte con nombre de una plantilla que también puedes renderizar por separado. Envuélvela en {% partialdef name %} y {% endpartialdef %}; con la palabra inline, también se dibuja en su lugar, una vez por cada elemento de un bucle. Una vista renderiza solo la parte usando el nombre de la plantilla, # y el nombre del fragmento:

{% partialdef cart-total inline %}
    <strong>{{ cart.total }}</strong>
{% endpartialdef %}
return render(request, "shop/cart.html#cart-total", {"cart": cart})

El contexto debe contener lo que lee la parte; en este caso, cart. La página y la parte comparten el mismo marcado, así que no pueden desincronizarse.

challenge icon

Desafío

Intermedio

Sirve una sola fila de la nueva página /tasks/.

  1. En tasks/list.html, convierte el <li> del bucle en un parcial inline llamado task-row, para que /tasks/ siga mostrando todas las filas.
  2. En tasks/views.py, añade task_row(request, pk): renderiza solo ese parcial, pasando task, o muestra la página 404 de Django.
  3. En tasks/urls.py, añade "tasks/<int:pk>/row/" con el nombre task_row.

Abre /tasks/3/row/: solo Llamar al banco (hecho), sin encabezado.

Pruébalo tú mismo

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>All tasks</title>
</head>
<body>
    <h1>All tasks</h1>
    <ul id="tasks">
        {% for task in tasks %}
            <li id="task-{{ task.id }}">{{ task.title }}{% if task.done %} (done){% endif %}</li>
        {% endfor %}
    </ul>
</body>
</html>
quiz iconPonte a prueba

Esta lección incluye un breve cuestionario. Empieza la lección para responderlo y registrar tu progreso.

Todas las lecciones de API JSON

Practica por tu cuenta: Playground de Django