Обновление объекта категории из формы через вызов ajax - PullRequest
Новая
       7

Обновление объекта категории из формы через вызов ajax

0 голосов
/ 24 июня 2018

Я пытаюсь создать индексную страницу для категорий, чтобы отобразить все категории.Каждая строка имеет название категории и кнопки для удаления и редактирования категории.Когда я нажимаю кнопку редактирования, я хочу, чтобы строка была заменена на форму с текстовым полем с предварительно заполненным именем и кнопкой сохранения.Пока я нажал кнопку редактирования и отобразил форму редактирования внутри строки.Но когда я нажимаю кнопку Сохранить, ничего не происходит.Вроде совсем ничего.В консоли нет ошибок, в сети не отображаются звонки, в журнале сервера нет активности.Я думал, что добавляю весь необходимый код для обработки вызова, но на данный момент я не знаю, где искать.Может кто-нибудь, пожалуйста, посоветуйте?Я использую рельсы v 4.2.5.

Application.js 

//this is for clicking edit and displaying Edit form inside the row
document.addEventListener("turbolinks:load", function() {
      $("[name='edits']").on('ajax:complete', function(event, data, status) {
        $(this).parent().parent().html(data.responseText)
      })
    })

    //this is to handle click on save button
    document.addEventListener("turbolinks:load", function() {
      $('#edit-form').on('ajax:complete', function(event, data, status){
        $('#categories').html(data.responseText);
      })
    })

Контроллер категории: 

def edit
    render  partial: 'categories/edits'
  end

  def update
    if @category.update(category_params)
      flash[:success] = "Category #{@category.name} was saved successfully"
    else
      flash[:danger] = "There was an error please try again!"
    end
    render partial: 'categories/list'
  end

Частичное редактирование формы: 

<div>
  <%= form_tag category_path, remote: true, method: :put, name: "edit-form" do %>
    <div class="form-group row text-center col-md-12">
      <div class="col-md-10">
        <%= text_field_tag :name, @category.name, 
                                  placeholder: "Category Name", autofocus: true,
                                  class: "form-control" %>
      </div>
      <div class="col-md-2">
        <%= button_tag(type: :submit, class: "btn btn-primary") do %>
          Save
        <% end %>
      </div>
    </div>
  <% end %>
</div>

В HTML я заметил, что поле ввода и кнопка находятся за пределами формы.Может ли это быть причиной проблемы?Вот так 

<form></form>
<input>
<button></button>

1 Ответ

0 голосов
/ 24 июня 2018

Да, я понял, что проблема была в том, чтобы поместить форму внутри тега tr. Перемещение в td, похоже, решает проблему.

...