0

f.inputコンポーネントを使用してブートストラップの日付ピッカーを追加するための単純なフォームのコード行を追加するのに苦労しています。

datepicker の例に従って、次のコードを使用してコンポーネントを使用してブートストラップ datepicker を追加できます。

<div class="input-append date" id="datepicker" data-date-format="dd-mm-yyyy">
   <input class="span2" size="16" type="text" value="12-02-2013" readonly>
   <span class="add-on"><i class="icon-th"></i></span>
</div>

<script type="text/javascript">
  $(document).ready(function(){
    $('[data-behaviour~=datepicker]').datepicker();
  })
</script

f.input上記の div をsimple_form コード行として書き直すにはどうすればよいですか

4

2 に答える 2

0

application.js または任意の .js ファイル

$(function() {
    $(".datepicker" ).datepicker({dateFormat: "dd/mm/yyyy"});
 });

ファイルを閲覧する

<div class="input-append date">
   <%=f.text_field :field_name, :class=>'datepicker'%>
   <span class="add-on"><i class="icon-th"></i></span>
</div>
于 2013-09-05T09:20:11.420 に答える
0

私のプロジェクトでは、これを使用しました: https://github.com/Nerian/bootstrap-datepicker-rails。

使い勝手が良くて良い逸品です

私のプロジェクトでは、単純なフォームの日時入力をオーバーライドするために、 app/inputs/date_time.input.rbにdate_time_input.rbファイルを作成します。

class DateTimeInput < SimpleForm::Inputs::DateTimeInput
  def input
    #template.content_tag(:div, super)
    "#{@builder.text_field(attribute_name, input_html_options)}".html_safe
  end
end

ビューに:

= f.input :date, :required => true, :input_html => { “data-behaviour” => “datepicker” }

そしてJS：

$(document).ready(function(){
  $(document).on(“focus”, “[data-behaviour~=’datepicker’]”, function(e){
    $(this).datepicker({“format”: “dd/mm/yyyy”, “weekStart”: 1, “autoclose”: true});
    });
});

これは、フランス語でそれを行うための私の記事です:-D

http://blog.jumboweb.fr/post/42841191962/datepicker-bootstrap-simple-form-avec-rails

于 2013-09-05T09:44:58.703 に答える