it-swarm.com.ru

Rails отправка формы через ajax и обновление представления

Я хочу обновить форму отправки через ajax без перезагрузки страницы и обновить представление в соответствии с ним. Я пробовал разные методы и потерпел неудачу, так как я новичок в Rails.

Вот ситуация.

В модальном

def new
    @new_entry = current_user.notes.build
    @words = current_user.notes
    @notes_false_list = current_user.notes.where(known: false).order("title").group_by { |note| note.title[0] }
    @notes_true_list = current_user.notes.where(known: true).order("title").group_by { |note| note.title[0] }
  end

В виду код формы.

<%= form_for @new_entry, :html => {:class => 'home-form without-entry clearfix'}  do |f| %>
      <%= f.text_field :title, placeholder: 'Squirrel', autofocus: true, class: 'title-field pull-left' %>
      <%= f.submit '', class: 'btn home-add without-entry' %>
  <% end %>

Действие создания

def create
    @new_note = current_user.notes.build(new_note_params)
    if @new_note.save
      @notes_list = current_user.notes.count
      unless @new_note.user.any_entry
        @new_note.user.toggle!(:any_entry) if @notes_list >= 50
        redirect_to root_url
      end
    else
      redirect_to root_url
    end
  end

и, наконец, по мнению, я хочу изменить

<p class="instructions count-instruction text-center">
      <%= @words.count %>
    </p>

Потратил много времени, обновляя его с помощью AJAX, но каждый раз терпел неудачу. Кто-нибудь, чтобы помочь? Заранее спасибо.

7
Praveen KJ

ваш код хорош, но для ajax ,

  1. вам нужно добавить remote=true к вашей форме. 

    <%= form_for(@image,:html=>{:id=>"your_form_id",:multipart => true,:remote=>true}) do |f |%>

  2. Более того, на вашей серверной стороне вам нужно создать файл js.erb в views/users/show_updated_view.js.erb, чтобы ответить браузеру как вызов jscall и NOT html и, следовательно, нужно показать пользователю, что что-то произошло (успех/ошибка) после отправки формы (если users_controller),

поэтому внутри вашего действия вам нужно что-то вроде: - 

        respond_to do |format|  
            format.js { render 'users/show_updated_view'}
        end  
  1. А в show_updated_view.js.erb вы должны обновить свое представление для пользователей, чтобы Знать, что представление было обновлено или форма была успешно Отправлена, либо скрывая всю форму/сбрасывая форму, либо Заменяя форму на new div говорит, что данные обновляются .. или все, что интуитивно понятно. Хотя есть много способов :).

    // здесь я заменяю всю вашу форму на div с сообщением 

    $("#your_form_id").html("<div><p>You have submitted the form successfully.</p></div>");

Название представления может быть любым, но вам нужно позаботиться об успехе и неудаче.

14
Milind

Вот короткая статья о работе AJAX с Rails . Несколько вещей, на которые стоит обратить внимание:

  1. Добавьте remote: true в свой form_for.
  2. Включите format.js в ваш контроллер, чтобы он отображал create.js.erb.
  3. В create.js.erb сделайте что-то вроде этого (не проверено):

    $("p.instructions").innerHTML("<%= @notes_list %>")

1
Yen-Ju

При использовании AJAX следует помнить, что вы не перенаправляете запрос (обычно), вы просто генерируете некоторый текст для отправки обратно в браузер. AJAX - это просто JavaScript, чтобы получить текст из браузера и что-то с ним сделать. Часто вы хотите заменить раздел страницы, т.е. заменить тег html и его содержимое, текстом, который вы возвращаете, и в этом случае вы хотите, чтобы этот текст представлял собой некоторый html. Способ рендеринга фрагмента html в Rails - рендеринг частичного, так что вы делаете это, и вы часто также делаете некоторый javascript, чтобы сообщить браузеру, что делать с текстом, обычно для замены элемента, который имеет определенный идентификатор на текст.

def create
  @new_note = current_user.notes.build(new_note_params)
  if @new_note.save 
    @notes_list = current_user.notes.count
    unless @new_note.user.any_entry
      @new_note.user.toggle!(:any_entry) if @notes_list >= 50
    end
  end
  respond_to do |format|
    format.html { redirect_to root_url }
    format.js #default behaviour is to run app/views/notes/create.js.erb file
  end
end

блок response_to здесь позволяет по-разному обрабатывать запросы html и js (например, ajax).

Приложение/views/notes/create.js.erb может иметь что-то вроде

page.replace "foo", :partial => "app/views/notes/bar"
0
Max Williams

Попробуйте добавить response_to block в действие вашего контроллера "create" и соответствующий файл create.js.erb и вставьте в свой js файл, который вы хотите выполнить после действия create, и постите любую ошибку, которую вы получаете на вашем консоль браузера или консоль сервера Rails, мы поможем вам найти причину ошибки

0
sghosh968