Mostrando el form en el template

En Vscode pueden usar la ext Djaneiro para que el codigo html se vea mejor.

También podríamos mejorar formularios a través de Django Crispy Forms, sin dejar de lado la legibilidad del código Pythonico.

https://django-crispy-forms.readthedocs.io/en/latest/

como coloco esos errors en español?

La primera vez que escucho que a # le dicen gato!! En Argentina le decimos numeral, y aca en España, donde vivo ahora le dicen almohadilla! Pero, gato nunca la habia escuchado!

Django me habia gustado mucho hasta el punto de tener que ocuparlo para hacer las vistas, creo que me quedare con el solo para el lado del back

Veo que siempre el form le pide colocar una fotografía, tenga o no el usuario, ¿cómo recomiendan hacerle para que no la pida siempre, si es que ya tiene una el usuario?

Añadi este codigo al nav y form asi cuando la persona agregue su imagen personal se actualice automaticamente

{% if request.user.profile.picture %}
            <div
              class="container rounded-circle"
              style="width: 30px;
                  height: 30px;
                  background-image: url('{{request.user.profile.picture.url}}');
                  background-size: cover;"
            ></div>
            {% else %}
            <img
              src="{% static 'img/default-profile.png' %}"
              class="rounded-circle"
              width="30"
              alt="Default profile picture"
            />
            {% endif %}

En Vscode pueden usar la ext Django para que el codigo se vea mejor.

Me está encantando este curso! Los formularios siempre me habían parecido muy complejos en django pero está super sencillo de entender, qué divertido

{% extends "base.html" %}
{% load static %}

{% block head_content %}
<title>@{{ request.user.username }} | Update profiles</title>
{% endblock %}

{% block container %}

<div class="container">

    <div class="row justify-content-md-center">
        <div class="col-6 p-4"id="profile-box">
            <form action="{% url 'update_profile' %}" method="POST" enctype="multipart/form-data">
                {% csrf_token %}

              
                <div class='media'>
                    {%if profile.picture %}
                    <img src="{{ profile.picture.url }}" class="rounded-circle" height="50"/>
                    {% else %}
                      <img src="{% static 'img/default-profile.png' %}" class="rounded-circle" height="50"/>
                    {% endif %}

                    <div class="media-body">
                        <h5 class="ml-4"> @{{ user.username }} | {{ user.get_full_name }} </h5>
                        <p class="ml-4"><input type="file" name="picture" required="true"></p>
                    </div>
                </div>

                {% for error in form.picture.errors %}
                <div class="alert alert-danger">
                    <b>Picture: </b>{{error}}
                 </div> 
                {% endfor %}
                 

                <hr><br>

                <div class="form-group">
                    <label>Website</label>
                    <input class="form-control {% if form.website.errors %} is-invalid {% endif %}"
                            type="text"
                            name="website"
                            placeholder="Website"
                            {#si ocurre un error, igual muesstra el valor ingresado --sino muestra el valor por defecto#}
                            value="{% if form.errors %} {{form.website.value}} {% else %} {{ profile.website }} {% endif %}"
                            />
                          <div class="invalid-feedback">
                            {% for error in form.website.errors %} 
                            {{error}}
                            {% endfor %}
                          </div>
                </div>
            
                <div class="form-group">
                    <label>Biography</label>
                    {#si ocurre un error lo muestra#}
                    <textarea 
                    class="form-control {% if form.biography.errors %} is-invalid {% endif %}" 
                    name="biography">
                    {% if form.errors %} {{form.biography.value}} {% else %} {{ profile.biography }} {% endif %}
                    </textarea>
                    {#acá muestra el error dentro de div en un cuadro rojo, con la descipcion#}
                    <div class="invalid-feedback">
                        {% for error in form.biography.errors %} 
                        {{error}}
                        {% endfor %}
                      </div>
                </div>

                <div class="form-group">
                    <label>Phone number</label>
                    <input
                        class="form-control {% if form.phone_number.errors %} is-invalid {% endif %}"
                        type="text"
                        name="phone_number"
                        {% if form.errors %} {{form.phone_number.value}} {% else %} {{ profile.phone_number }} {% endif %}
                        placeholder="Phone number"
                        value="{{ profile.phone_number }}"
                    />
                    <div class="invalid-feedback">
                        {% for error in form.phone_number.errors %} 
                        {{error}}
                        {% endfor %}
                      </div>
              </div>

                <button type="submit"class="btn btn-primary btn-block mt-5">Update info</button>
            </form>
        </div>
    </div>
</div>
{% endblock %}

Me parece que phone_number no tiene una validación apropiada para un número (por ser CharField) así que cuidado con rellenarlo con letras sin querer.

PD: Supongo que lo resolverá más adelante.

Alguien tiene problemas con el textarea de la biografía, a mi me aparecen muchos espacios en blanco antes y después del mensaje, y mientras mas lineas de código de {% if… %} pongo, mas aparecen 😕

Necesitamos llevar las propiedades del form al front-end.

Excelente gracias

Cómo podría autocompletar con formulario, a partir del valor de determinado input?

Excelente vamos avanzando y es muy amigable el manejo de forms!

gracias pablo, si hagamos el codigo de una forma mas elegante, pq de este forma hay mucho repetido DRY

Porque cuando envio varias veces el form vacio se cambia la imagen a la default?

Como puedo hacer para que se corte la imagen en cuadrado al subirla?

¿Alguien me podría explicar cuando se debe usar: {{ }} y {% %} ?
Gracias 😃 ❤️

Hola, tengo una duda, ¿Como puedo pintar los errores de un formulario pero en español?

Esta algo complicado pero entendible aqui el link de la documentacion de la clase:

• Formularios Django

Existen diferentes formas en las que se pueden mostrar los valores del form, estas son: as_table, as_p y as_ul. También se pueden mostrar campos de manera individual, incluso customizar las clases que se van a usar para mostrar los errores, etc. Refinaremos la apariencia del form a través de algunas refactorizaciones en el template.

Cuando imprime el error de un campo del formulario [form.website.error], ¿Cuál es la referencia al nombre [form. website .error]?

• es a la etiqueta <label>Website</label>
  -es al atributo name del input <input name=“website”>
• o cual???

Alguien pudo ver lo que explica al final de no repetir el código cada vez?