使用optgroup选择输入的Playframework scala助手

时间:2014-12-03 09:19:44

标签: scala templates select playframework optgroup

是否正在使用框架scala帮助器来实现输入选择中的optgroup?

示例:

 http://jsfiddle.net/g4ffzvs8/

代码:

<select style="width:300px" id="source">
               <optgroup label="Alaskan/Hawaiian Time Zone">
                   <option value="AK">Alaska</option>
                   <option value="HI">Hawaii</option>
               </optgroup>
               <optgroup label="Pacific Time Zone">
                   <option value="CA">California</option>
                   <option value="NV">Nevada</option>
                   <option value="OR">Oregon</option>
                   <option value="WA">Washington</option>
               </optgroup>
              </select>

3 个答案:

答案 0 :(得分:3)

没有一个答案让我满意。创建了一个新版本的select helper,它接受组名:

@(field: play.api.data.Field, options: Seq[(String, Seq[(String,String)])], args: (Symbol,Any)*)(implicit handler: helper.FieldConstructor, messages: play.api.i18n.Messages)

@helper.input(field, args:_*) { (id, name, value, htmlArgs) =>
    @defining( if( htmlArgs.contains('multiple) ) "%s[]".format(name) else name ) { selectName =>
    @defining( field.indexes.nonEmpty && htmlArgs.contains('multiple) match {
        case true => field.indexes.map( i => field("[%s]".format(i)).value ).flatten.toSet
        case _ => field.value.toSet
    }){ selectedValues =>
        <select id="@id" name="@selectName" @toHtmlArgs(htmlArgs)>
            @args.toMap.get('_default).map { defaultValue =>
                <option class="blank" value="">@defaultValue</option>
            }
            @options.map { case (groupName, elements) =>
                <optgroup label="@groupName">
                @elements.map { case (k, v) =>
                    @defining( selectedValues.contains(k) ) { selected =>
                    @defining( args.toMap.get('_disabled).exists { case s: Seq[String] => s.contains(k) }){ disabled =>
                        <option value="@k"@if(selected){ selected="selected"}@if(disabled){ disabled}>@v</option>
                    }
                }
                </optgroup>
            }}
        </select>
    }}
}

(对于2.4之前的Play版本,请使用lang : play.api.i18n.Lang代替messages: play.api.i18n.Messages

你可以这样使用这个助手:

@groupSelect(
    form("brand"),
    Seq(
        "Swedish Cars" -> Seq(
            "volvo" -> "Volvo",
            "saab" -> "Saab"
        ),
        "German Cars" -> Seq(
            "mercedes" -> "Mercedes",
            "audi" -> "Audi"
        )
    )
)

它将呈现这一点:

<select id="brand" name="brand">
  <optgroup label="Swedish Cars">
    <option value="volvo">Volvo</option>
    <option value="saab">Saab</option>
  </optgroup>
  <optgroup label="German Cars">
    <option value="mercedes">Mercedes</option>
    <option value="audi">Audi</option>
  </optgroup>
</select>

答案 1 :(得分:0)

这是我的工作解决方案:

<div class="clearfix @if(MedicalIncidentForm("incidentType.id").hasErrors) {error}">
    <label class="note note-title  note-@if(MedicalIncidentForm("incidentType.id").hasErrors) {error} else {success}" for="incidentType_id">Rodzaj</label>
    <div class="input note note-footer note-@if(MedicalIncidentForm("incidentType.id").hasErrors) {error} else {success}">
        <select name="incidentType.id" onchange="checkSelectedValue(this)">
            <option></option>
            @for(opt <- new IncidentType().getOptionGroups()) {
               <optgroup label="@opt._1">
                    @for(op <- opt._2) {
                        @**
                        <option  value="@op._1">@op._2</option>
                        **@
                        <option value="@op._1" @if(MedicalIncidentForm("incidentType.id").value() == op._1) {selected="selected"}>@op._2</option>
                    }
                </optgroup>
            }
        </select>
        </div>
</div>

答案 2 :(得分:-1)

查看scala中的select helper:https://github.com/playframework/playframework/blob/master/framework/src/play/src/main/scala/views/helper/select.scala.html

没有提及optgroup所以我认为答案是否定的。无论如何,您可以通过复制代码并自定义它来创建自己的帮助程序,以便它集成optgroups。例如,这是我的自定义输入文本的代码。由于一个错误,我不得不删除隐含的i18n语言:

@(field: play.api.data.Field, args: (Symbol,Any)*)(implicit handler: views.html.helper.FieldConstructor)

@inputType = @{ args.toMap.get('type).map(_.toString).getOrElse("text") }
@inputClass = @{ args.toMap.get('class).map(_.toString) }

@helper.input(field, args.filter(_._1 != 'type).filter(_._1 != 'class):_*) { (id, name, value, htmlArgs) =>
    <input type="@inputType" id="@id" class="form-control @inputClass" name="@name" value="@value" @toHtmlArgs(htmlArgs)/>
}