IIC2143-2020-2 / syllabus

Syllabus de IIC2143 Ingeniería de Software 2020-2
35 stars 10 forks source link

Actualizar un form con información nueva #228

Closed benjavicente closed 4 years ago

benjavicente commented 4 years ago

Hola! Estoy tratando de seguir la guia de Rails para mostrar los errores al crear un record en un form, pero al hacer el render en el controlador respectivo, la página en el navegador se queda con los mismos contenidos: no hay errors.any? y tampoco se añade el <div class="field_with_errors">.

En la consola se muestra que se hacer el request y el render:

Rendered articles/new.html.erb within layouts/application
Completed 200 OK

En la vista tengo un form básico junto al código que se muestra en la guía y tengo algo así en el controlador:

  ...
  def new
    @article = Article.new
  end

  def create
    @article= Article.create(article_params)
    if @article.save
      redirect_to article_path
    else
      render :new
    end
  end
  ...

¿Qué puede estar faltando? Gracias de antemano!

meretamal commented 4 years ago

Hola 😁

Podrías mandar el contenido del form que estás usando?

benjavicente commented 4 years ago

En general, tengo esto en los forms de la vista:

<!-- app/views/articles/new.html.erb -->
...
<%= form_with(model: @article, method: :post) do |form| %>

    <div class="field">
      <%= form.label :name, class: 'label' %>
      <%= form.text_field :name, class: 'input' %>
    </div>

    <div class="field">
      <%= form.label :image, class: 'label'  %>
      <%= form.file_field :image %>
    </div>

    <div class="field">
      <%= form.label :description, class: 'label' %>
      <%= form.text_area :description, class: 'textarea' %>
    </div>

    ...

    <div class="field">
      <%= form.label :date, class: 'label' %>
      <%= form.date_field :date, class: 'input' %>
    </div>

    <div class="action">
      <%= form.submit class: 'button is-primary' %>
    </div>

<% end %>
...

lo que creo que debería pasar, es que al hacer el render, los contenidos del form se deberían cargar nuevamente, pero al añadir un <%= rand -%> para verificar si está pasando, el número no cambia.

No estoy usando partials y las views fueron creadas a mano.

meretamal commented 4 years ago

Lo que pasa es que form_with por defecto está pensado para utilizar Ajax, por lo que previene la acción por default del form.

Intenta usando form_with(model: @article, method: :post, local: true)

benjavicente commented 4 years ago

Con eso me funcionó! Gracias!

Lo que pasa es que form_with por defecto está pensado para utilizar Ajax, por lo que previene la acción por default del form.

No entendí eso, ¿cuál sería la acción por defecto? Yo pensé que Rails se encargaba de actualizar la parte del form (dentro del bloque form_with) al hacer el request. Esta solución actualiza toda la página, pero con eso me conformo.

meretamal commented 4 years ago

Hola @benjavicente, perdón por contestar recién ahora 🙈 .

Para contextualizar un poco el tema, AJAX es un acrónimo para Asynchronous JavaScript And XML, la cual es una herramienta utilizada para realizar cambios sobre las páginas sin la necesidad de recargarlas, mejorando la interactividad, velocidad y usabilidad de las aplicaciones. Por ejemplo, si implementan una funcionalidad de likes y dislikes, por el momento, con las herramientas que conocen, al presionar el botón tendrían que recargar la página para ver el cambio, en cambio, utilizando AJAX, se hace el request y se actualiza la vista utilizando JavaScript (si quieres aprender un poco más de este tema, puedes preguntarme).

Sin embargo, para poder hacer esto es necesario evitar la acción por default del form, ya que sino la página se recargaría al hacer submit de él.

form_with por defecto utiliza AJAX (a diferencia de form_tag o form_for), por lo que hay que "decirle" que no evite la acción por default y esto se hace agrando local: true en él.

benjavicente commented 4 years ago

(AJAX) es una herramienta utilizada para realizar cambios sobre las páginas sin la necesidad de recargarlas

es necesario evitar la acción por default del form, ya que sino la página se recargaría al hacer submit de él.

form_with por defecto utiliza AJAX (a diferencia de form_tag o form_for), por lo que hay que "decirle" que no evite la acción por default

Me enrede un poco 😅. Entendí perfecto que hace AJAX, pero no como Rails lo implementa y que es lo que se hace por defecto, porque form_with por defecto no recarga o actualiza la página, y no se muestran los mensajes de error del helper.

Lo otro respecto a AJAX, el objetivo es mandar trozos de HTML con XML? Vi un par de ejemplos y no me quedó claro porque se usa XML en vez de algo más "compacto" como JSON (o si se usan ambos), por ejemplo, cuando se usa para crear una tabla.

meretamal commented 4 years ago

Hola 😁

La verdad que explicar todo en una issue es un poco difícil jaja.

Si quieres me puedes hablar por telegram (meretamal) y te puedo mandar una ayudantía que hice de esto hace un año, o hasta podríamos coordinar una llamada para explicarte bien todo.