使用 ajax 向 ruby​​ 控制器发送数据

Question

我想做什么：

我正在创建一个 ruby​​ on rails 应用程序，它拥有一个播放列表。播放列表属于一个用户对象，是一个散列。我需要两个关键按钮。一个用于将新音乐添加到哈希中，另一个用于从哈希中删除音乐。我正在使用 javascript 来跟踪当前歌曲，每当按下添加按钮时，它都应该通过 ajax 发送回 add_song 控制器，然后该字符串将被添加到播放列表哈希中。但是我坚信我的实施已经关闭，因为我不断收到 500 错误。目前我只担心 add_song 按钮。非常感谢任何帮助！

当前错误： POST http://localhost:3000/adding 500（内部服务器错误）

下面是我不显眼的 javascript 代码：

var player = new Audio("File1.mp3");
var value = 1 ;
var track = "File.mp3";


function backward() {
         var temp2 = player.src[player.src.length - 5] ;


          if ( temp2 != 1){
                value = parseInt(temp2);
                value  -= 1;
                player.src = "/File"+value+".mp3";
                player.play();
}
}

function forward() {
           var temp2 = player.src[player.src.length - 5] ;

           if ( temp2 != "5")  {
                value = parseInt(temp2);
                value  += 1;
                player.src = "/File"+value + ".mp3";
                player.play();
}
  }

  function play(){
        player.src  = "/File"+value + ".mp3";
         player.play();
} 

  function pause( ) {
         player.pause();
}


 //add button
 //delete button




function get_song() {
 return player.src
}

$(document).ready(function() {
$("div div").click( function(){

 if ( this.id  ==  'play' ) {
        play();
 }else if(this.id == 'backward'){
        backward();
 }else if(this.id == 'forward'){
        forward();
  }else if(this.id == 'stop') {
    pause() ;
  }else if(this.id == 'add_song') {
    $.ajax({
    url: "adding",
    type: "post",
    data: {data_value: JSON.stringify(player.src)}
 });
 }

});
});

下面是我的静态页面控制器

   class StaticPagesController < ApplicationController

  respond_to :js, :json, :html

    def add_song()
           if user_signed_in?
                session[:user_id] = current_user.id
                present_user = User.find(session[:user_id])
                puts present_user
                present_user.playlist.store(params[:data_value], 1)
                present_user.save
                puts "It works"
        else
        end
        end

        def remove_song()
            if user_signed_in?
             session[:user_id] = current_user.id
             present_user = User.find(session[:user_id])
             present_user.playlist.delete(params[:data_value])
             present_user.save
            else
        end
        end





  def home
   end

end

最后是我的路线：

 devise_for :users, :controllers => { :sessions => "sessions" , :registrations => "registrations"}
  devise_scope :user do
    get   "/log_in" => "sessions#new" ,as: :new_user_sessions
     post  '/log_in' => "sessions#create" ,as: :user_sessions
    delete "/destroy" => "devise/sessions#destroy", as: :destroy_user
    get   '/edit' => 'devise/registrations#edit'
    get   "/sign_up" => "registrations#new", as: :new_user_registrations
    post  "/sign_up" => "registrations#create", as: :user_registrations
 end

  root 'static_pages#home'
  match '/home', to:'static_pages#home', via: 'get'
  match '/adding',   to: 'static_pages#add_song',   via: 'post'

Answer 1

你需要这样做：

“render json:”之后的内容将作为结果返回给 ajax 调用。在这种情况下，如果用户保存它会返回“它可以工作”的字样：

def add_song()
 if user_signed_in?
   session[:user_id] = current_user.id
   present_user = User.find(session[:user_id])
   present_user.playlist.store(params[:data_value], 1)
   if present_user.save
     render json: { success: "It works" }
   end
 end
end

现在在 Ajax 调用中，我们需要定义回调以在成功的情况下处理响应。你还需要在你的视图中添加一个类（在这个例子中，这个类的 id 是'result'）并且在那个元素中你将呈现你想要显示的响应： ...

else if(this.id == 'add_song') {
 $.ajax({
   url: "adding",
   type: "post",
   data: {data_value: JSON.stringify(player.src)},
   success: function(response) {
      $('#result').html(response.success);
   }
 });
}