Обработка контроллера пост-запросов AJAX

Question

Я пытаюсь заставить работать простой пост-запрос ajax, поэтому, когда я нажимаю кнопку на своей html-странице, вызывается прослушиватель событий javascript, который создает запрос поста ajax, который возвращает некоторый текст.Я пытаюсь заставить его работать так, чтобы функция успеха в моем ajax-запросе распечатывала полученный текст, но у меня возникли проблемы с его завершением, и я думаю, что это из-за того, как мой файл controller.rb обрабатывает запрос.Пока у меня есть:

index.html.erb

<%= javascript_include_tag "application" %>

<h1>Welcome to my website#index</h1>

<input class="className" id="idName" type="button" value="Click Me!" id="my_button" remote:true/>

<ul id="ulID">
 <div class = 'wantToChange'>This should change when button is pressd.</div>
</ul>

application.js

$(document).ready(function(){
    $('.className').on('click', function(){
        console.log("inside js click listener");

       $.post('superman', { field1: "hello", field2 : "hello2"}, 
       function(returnedData){
            console.log(returnedData);
       });

    });
});

welcome_controller.rb

class WelcomeController < ApplicationController
  def index
  end

  def superman
    some_parameter = params[:some_parameter]
    #do something with some_parameter and return the results
    render plain: "OK"
  end

end

rout.rb

Rails.application.routes.draw do
  get 'welcome/index'

  resources :test do
    collection do
      get 'test'
    end
  end

  root 'welcome#index'
end

Но при запуске этого процесса при нажатии кнопки возникает следующая ошибка:POST http://localhost:3000/superman 404 (не найден). Что заставляет меня думать, что мой файл контроллера не настроен правильно для получения этого маршрута «сверхчеловека»?Любая помощь высоко ценится, спасибо.

Answer 1

Вы можете выполнить ajax-запрос с помощью гема remotipart Вам просто нужно добавить гем

gem 'remotipart', github: 'mshibuya/remotipart', ref: '88d9a7'

Затем вам нужно сделать несколько простых изменений в форме

<%= form_for @document, :html => { :multipart => true, :id => "create-document-form" }, :remote => true do |document_form| %>
  <%= document_form.file_field :file_upload, class: "custom-file-input" %>
<% end %>

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

def create
  @document = Document.new(document_params)
  respond_to do |format|
    if @document.save
      data = {visible_for_client: @document.visible_for_client, file_name: file_name.to_json, description: @document.description, file_path: file_url}.to_json
      format.js { render :js => "append_document(#{data});" }
    else
      format.json { render json: { errors: @document.errors.full_messages }, status: 422 }
    end
  end
end

Так что я вызову метод js из контроллера и передам мойданные сообщения и сообщения через этот метод.

function append_document(data){
  console.log("Document created successfully.")
}

Answer 2

1 => Index.html.erb

<!-- this line should be in application.html.erb 
  <%#= javascript_include_tag "application" %>
-->
<h1>Welcome to my website#index</h1>

<input class="className" id="button_to_be_clicked" type="button" value="Click Me!" id="my_button"/>

<ul id="ulID">
 <div class = 'want_to_change'>This should change when button is pressd.</div>
</ul>

   <script type="text/javascript">
     $('#button_to_be_clicked').on('click', function(){
      // ajax request 
       $.ajax({
         url: "/superman",
         type: "POST",
         data : {
           value1: "hello",
           value2: "hello2"            
         },
         dataType: "script",
      });        
     })
   </script>

2 => rout.rb

Rails.application.routes.draw do
  root 'welcome#index'

  post '/superman', to: 'welcome#superman'

  resources :test do
    collection do
      get 'test'
    end
  end
end

3 => welcome_controller.rb

class WelcomeController < ApplicationController
  def index
  end

  def superman
    value1 = params[:value1]
    value1 = params[:value2]
    render plain: "OK"
  end

end

3 => superman.js.erb

$('.want_to_change').html("Text to be changed on ajax request.")