5

時間と助けを前もってありがとう！

Play 2.0.4 でカスタム フォーム フィールドを構築しようとしています。これは、ここにある Twitter ブートストラップ デートピッカーを使用します。

基本的に、これを出力するカスタム フィールド コンストラクターを作成しようとしています。

<div class="input-append date error" id="expires_field" data-date="" data-date-format="mm/dd/yyyy">
    <label for="expires_field">Expiration Date</label>
    <div class="input">
        <input class="span2" size="16" type="text" name="expires" id="expires" value="mm/dd/yyyy">
        <span class="add-on"><i class="icon-th"></i></span>
        <span class="help-inline"></span>
    </div>
</div>

しかし、インターネットを何度も閲覧しているにもかかわらず、Play 2.0 でエラーを検証して表示できるカスタム フォーム フィールドを作成する方法がわかりませんでした。

ほとんどの場合、ファイルがアプリ構造のどこにある必要があるかについて少し混乱していると思います。

どんな助けでも大歓迎です！

ピクセルワールド

4

2 に答える 2

8

私もこれに苦労していて、これが私が思いついたものです：

@(field: play.api.data.Field, args: (Symbol,Any)*)(implicit lang: play.api.i18n.Lang)

@import play.api.i18n._
@import views.html.helper._

@elements = @{ new FieldElements(field.id, field, null, args.toMap, lang) }

<div class="control-group">
  <label class="control-label" for="@field.name">@elements.args.get('_label)</label>
  <div class="controls">
    <div class="input-append date" id="@field.id-picker" data-date="@field.value" data-date-format="@elements.args.get('format).getOrElse("mm/dd/yyyy")">
      <input type="text" name="@field.name" id="@field.id">
      <span class="add-on"><i class="icon-calendar"></i></span>
      <span class="help-inline">@elements.errors(elements.lang).mkString(", ")</span>
      <span class="help-block">@elements.infos(elements.lang).mkString(", ")</span> 
    </div>
  </div>
</div>

これをファイルcalendar.scala.htmlに保存し、次のように使用します。

@views.html.forms.calendar(
  myform("end"),
  '_showConstraints -> false,
  '_label -> Messages("label.end.date"),
  'format -> "dd/mm/yyyy"
)

次に、JSで：

$('#end-picker').datepicker({
  weekStart: 1
}).on('changeDate', function(ev){
  $('#end-picker').datepicker('hide');
});

IDの名前はfield.name+"-picker"で生成されます

また、inputTextを使用することもできます。

@inputText(
  myform("start"),
  '_showConstraints -> false,
  '_label -> Messages("label.start.date"),
  'class -> "date-picker",
  Symbol("data-date-format") -> "mm/dd/yyyy"
)

それが役に立てば幸い

于 2012-12-12T15:10:59.827 に答える
0

これを解決する最も簡単な方法は、Bean レベルで注釈 (play.data.format.Formats) を定義することでした。

@Formats.DateTime(pattern = "mm/dd/yyyy") public Date start;

フレームワークは、HTML でのレンダリングを処理します。

于 2013-11-24T20:04:40.260 に答える