2017-04-06 16 views
1

私はルビーからインデックスのデータから値を渡すしようとしています:user.rbファイルにjavascriptのフルカレンダーにRubyでハッシュの配列からデータを渡す

list = [{:date=>"07 Mar", :price => "1000,00", :fruit=>"Orange"}, 
{:date=>"07 Mar", :price => "2000,00", :fruit=>"Apple"}] 

のJsにfull_calendarに。 js:

dayRender:function(date, cell){ 
    var array = <%= j @list.to_json %>; 
    $(cell).html('<span>' + array + '</span>'); 
    }, 

フルカレンダーで動作させることはできません。私はこれまでにさまざまなオプションを試してきましたが、インデックス0、1、または2の値のリスト1にアクセスするソリューションは見つかりません...

アイデアはありますか?

+0

あなたのRubyコードはありますか? ( '@ list'ではなく' list'を持っています) – inye

+0

ルビコードがJSONを出力している場合は、プロパティにアクセスする前に解析する必要があります。 ( 'JSON.parse') – evolutionxbox

+0

変数(' @ list')はどこから来たのですか?jsファイルを使用していますか? –

答えて

1

サーバーとクライアントの部分を分割し、それぞれをテストする必要があります。 最初のRuby:このようなものが必要です。最初は別のRubyスクリプトでテストしてください。

require 'json' 
@list = [{:date=>"07 Mar", :price => "1000,00", :fruit=>"Orange"}, {:date=>"07 Mar", :price => "2000,00", :fruit=>"Apple"}] 
@list.to_json 
# [{"date":"07 Mar","price":"1000,00","fruit":"Orange"},{"date":"07 Mar","price":"2000,00","fruit":"Apple"}] 

次に、クライアント部分:あなたはjavascriptで結果を見ることができる場所にRubyコードを入れます。あなたがラインのどこかでjsonを必要とするようにしてください。

これが機能すれば、@list変数がerbファイルで認識されているかどうかをテストすることです。この変数を渡すことに集中しない場合、正しいパスにerbファイルがありますか?あなたのルートは正しいですか?などの余分なよう

dayRender:function(date, cell){ 
    var array = <%[email protected]_json %>; 
    $(cell).html('<span>' + array + '</span>'); 
    }, 

:あなたは、あなたの問題を抽出し、他の影響について気にすることなく、それをテストし、上記のすべてのことができますいくつかの簡単なテストスクリプトは、あなたがそれを把握することはできません場合には、ここで公開することができます作ります。 あなたはこれをレールに求めますが、私はSinatraをほとんど使用していますので、Railsでも同じことをしなければなりません。あなたがSinatraを知らない場合は、これをすべてapp.rbに入れて実行してください。ウィッヒファイル内

require 'sinatra' # gem install sinatra 
require "sinatra/reloader" #so that you don't have restart the server after changes 
require 'json' 

get '/' do 
    @list = [{:date=>"07 Mar", :price => "1000,00", :fruit=>"Orange"}, {:date=>"07 Mar", :price => "2000,00", :fruit=>"Apple"}] 
    erb :index 
end 
__END__ 
@@ index 
<script type="text/javascript" src="./jquery.js"></script> 
<script> 
    $(document).ready(function(){ 
    var array = <%[email protected]_json%>; 
    console.log(array); 
    }); 
</script> 
<body> 
</body> 

そして、はい、私はコンソールであなたのJSONを取得。..

+0

あなたの答えに感謝@ピーターそれは私を始めた。以下は、私が正しいパスで私を始めました、私は対応するセルにロードする必要がある各値を日付までにキャッチするオブジェクトを反復処理する必要があることを知っています。 'dayRender:機能(日付、セル){ VARのJSON = <%= 必要 'JSON' (@ list.to_json.html_safe %>; $(セル)の.html( '​​' +(JSON.stringify (json、null、4))+ ''); }、 ' – j0h4nf

関連する問題