我有一些测验系统,用户可以通过单选按钮显示问题和几个答案选项.
但是当我使用一个通过列表填充的inputRadioGroup的帮助器时,它看起来不再漂亮了(比如Twitter Bootstrap). radiobuttons是内联的,而它们应该在彼此之下.实际上我想将图标更改为更漂亮的按钮.
这就是它当下的样子:
因此我尝试编写自己的自定义表单助手,但一直卡住.我觉得很难理解这个文档:
https://www.playframework.com/documentation/2.3.x/JavaFormHelpers
首先,我创建了一个名为myFieldConstructorTemplate.scala.html的新模板
@(elements: helper.FieldElements)
@elements.label
@elements.input
@elements.errors.mkString(",")
@elements.infos.mkString(",")
将其保存到/ views-folder.然后尝试在我的视图类quiz.scala.html中使用它:
@import helper._
@import helper.twitterBootstrap._
@(questionList: List[Question],answerList: List[Answer],answerRadioForm: Form[Answer])
@helper.form(action = routes.Application.nextQuizPage(),'id -> "answerRadioForm"){
@helper.inputRadioGroup(
answerRadioForm("Answer"),options = answerList.map(answer => answer.answerID.toString -> answer.answerText),'_label -> "Answer",'_error -> answerRadioForm("answerID").error.map(_.withMessage("select answer")))
Next Question
}
@implicitField = @{ FieldConstructor(myFieldConstructorTemplate.f) }
@inputText(answerRadioForm("questionID"))
如果我把它放到我的模板中,我得到一个not found:value implicitField-error.
那么我怎么能设法将我的无线电按钮的外观改为底部并看起来像Twitter Bootstrap?
[EDIT1]:我已将导入的顺序更改为建议的版本:
@(questionList: List[Question],answerRadioForm: Form[Answer])
@import helper._
@implicitField = @{ FieldConstructor(myFieldConstructorTemplate.f) }
@import helper.twitterBootstrap._
我得到了这个错误:
ambiguous implicit values:
both method implicitField of type => views.html.helper.FieldConstructor
and value twitterBootstrapField in package twitterBootstrap of type
=> views.html.helper.FieldConstructor match expected type
views.html.helper.FieldConstructor
我认为这与我将答案导入radiobuttons的方式有关?
[EDIT2]:
现在进口的顺序是:
@(questionList: List[Question],answerRadioForm: Form[Answer])
@import models.Question
@import models.Answer
@import helper._
@implicitField = @{ FieldConstructor(myFieldConstructorTemplate.f) }
有了这个,该程序编译.但是无线电按钮看起来仍然一样.所以我试图改变设计,这不太合适.现在看起来所有的radiobutton都融化成一个:
这是我的模板类myFieldConstructorTemplate.scala.html:
@(elements: helper.FieldElements)
@elements.label
@elements.input
@elements.errors.mkString(",")
[编辑方面3]:我已经根据to the last answer改变了我的班级,但仍然将无线电按钮融合在一起.所以我想指出我并不关注使用inputRadioGroup from the playframework helper,如果有另一个解决方案工作原理相同并且看起来几乎像bootstrap,我很乐意使用它.似乎改变助手并不容易/直观.我感谢任何形式的帮助!