JavaScript 與 Ruby on Rails前後端傳值(以字串為例)

當使用Ruby on Rails 作為後端開發，前端使用JavaScript時，我們可能會需要從Rails的model中把某個欄位值(字串)取出，然後在view中存成JavaScript的變數，然後在網頁印出這個字串，例如今天想開發一個顯示全台咖啡廳資訊的網站，我們會把所有咖啡廳資訊都存在Rails的model裡面，當想在view顯示咖啡廳名稱，並且在前端運用JavaScript做一些動作時，我們的做法可能會是先從Rails的controller把要撈取的咖啡聽資料從model中取出存成的實例變數，例如要取出第一筆咖啡廳資料，寫法會像下面這樣

@coffee = Coffee.first

然後在前端的view中取用這個實例變數，存成JavaScript的變數，然後在網頁印出這個字串，例如我們想取出咖啡廳的名字，存到叫title的JavaScript變數中，可能會寫成像下面這樣

var title = <%= ＠coffee.name %>

但雖然上述寫法可以成功將Rails的實例變數存入JavaScript 的 title變數中，但在後續使用title利用JavaScript的方法做一些處理時，JavaScript可能會無法判讀出title存的這是一個字串，然後就會出錯，所以其實應該要寫成這樣

var title = “<%= @coffee.name %>”

這樣在頁面上印出title時才不會發生錯誤，以下舉例

當我們想從 後端的咖啡廳資料庫(coffee model)取出資訊在網頁上畫出咖啡廳分佈，並實作在地圖上利用彈跳視窗顯示出咖啡廳的資訊時，在彈出視窗設定想要顯示名稱地址，所以我們會在controller取出所有coffee model資料存入@coffees中

＠coffees = Coffee.all

然後在view利用Rails的方法將每一筆資料塞入JavaScript陣列變數中，

var locations = [];
<% @coffees.each do |coffee| %>
locations.push({title: “<%= coffee.name %>”, address: “<%= coffee.address %>”,location: {lat: <%= coffee.latitude.to_f %>, lng: <%= coffee.longitude.to_f %>}});
<% end %>

這樣的寫法有助於後續畫在地圖上時製作popup視窗可以使用相關資訊顯示，取出咖啡廳的名字跟地址時，存放入title中，要加上 “”，這樣才會存成JavaScript的字串，如果沒有加，就會出現 Uncaught SyntaxError: Unexpected identifier這樣的錯誤，印出來的source code會像下面這樣

會造成上述問題主要可能是因為Rails model中的字串在直接存到JavaScript變數中並不會自動轉成JavaScript字串的形式，當字串有空白或斷掉時，就會出錯，因此我們會需要把Rails的字串存入JavaScript的變數中時加上“ ” ，加上之後可以看到印出的source code會像下面這樣，就沒有不是字串格式的問題了

在地圖上popup視窗顯示也不會有問題