jquery datebox沒有模式的名稱加載/模式沒有給出

Question

我需要一個時間選擇器在我的rails應用程序，和jquery datebox似乎完美，但我不能使它的工作。

在我application.html.haml我有

%link{:href => "http://code.jquery.com/mobile/latest/jquery.mobile.min.css", :rel => "stylesheet", :type => "text/css"}/ 
%link{:href => "http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.min.css", :rel => "stylesheet", :type => "text/css"}/ 
%script{:src => "http://code.jquery.com/mobile/latest/jquery.mobile.min.js", :type => "text/javascript"} 
%script{:src => "http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.core.min.js", :type => "text/javascript"} 
%script{:src => "http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.mode.calbox.min.js", :type => "text/javascript"} 
%script{:src => "http://dev.jtsage.com/cdn/datebox/i18n/jquery.mobile.datebox.i18n.en_US.utf8.js", :type => "text/javascript"} 

而且我HAML代碼

%label{:for => "mydate"} Some Time 
%input#mydate{"data-options" => "{\"mode\" => \"flipbox\"}", "data-role" => "datebox", :name => "mydate", :type => "date"}/ 

如下所示http://cl.ly/image/1Y0t210L3a3c

錯誤我一直有這個被翻譯爲http://cl.ly/image/1a0l3A20471r

我嘗試了不同的盒子類型datebox，但只有calbox的作品。

感謝

Answer 1

那麼，你的問題的一部分，可能是這裏的行：

%script{:src => "http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.mode.calbox.min.js", :type => "text/javascript"} 

這是加載僅的 'calbox' 模式。如果你想使用flipbox，如上面的代碼HAML，你需要或者/還有：

%script{:src => "http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.mode.flipbox.min.js", :type => "text/javascript"} 

你的下一個問題是（也許）在翻譯代碼片段 - 數據選項是由雙引號，如同對象中的每個項目一樣 - 根據瀏覽器的不同，它會導致javascript解析它們時出現問題。你可以決定不使用數據的選項，並用長選項，而不是...即：

data-datebox-mode="calbox" 

（注：我沒有測試在一個小而長的選項，不完全記得如何這是行之有效的 - 讓我知道如果它失敗了。）

否則，它可能需要與哈姆分析器混合使它發揮很好 - 這可能比它的價值更麻煩（不知道，我不是非常熟悉產品）

Answer 2

數據選項部分需要用單引號括起來。使用雙引號不適用於我

data-options='{"mode":"datebox"}'