Blankman
Blankman

Reputation: 267290

Play's built-in form helper is outputing the data type boolean in the HTML

Why does my checkbox in my form display so ugly using the built-in form helperin play?

My form looks like:

val subscriptionManageForm = Form(
    mapping(
      "token" -> optional(text),
      "unSubscribe" -> boolean
    ) (SubscriptionManageForm.apply)(SubscriptionManageForm.unapply)
  )

The result HTML looks like:

<dl class=" " id="unSubscribe_field">

    <dt><label for="unSubscribe">unSubscribe</label></dt>

    <dd>
    <input type="checkbox" id="unSubscribe" name="unSubscribe" value="true"  />
    <span></span>
</dd>


        <dd class="info">format.boolean</dd>

</dl>

Below is a screenshot of what it looks like:

enter image description here

My view page looks like this, as you can see I have some commented out HTML where I was trying to use another form of a helper, but it pretty much outputted the exact same HTML as it does now.

@helper.checkbox(form("unSubscribe"))
            <!--@helper.input(form("unSubscribe")) { (id, name, value, args) =>-->
                <!--<input type="checkbox" name="@name" id="@id" >-->
            <!--}-->

Why does it output format.boolean ??

Upvotes: 1

Views: 380

Answers (1)

Julian Pieles
Julian Pieles

Reputation: 4016

The format.boolean looks like a not translated string? You have several options to fix this.

Option 1

To set format.boolean edit or create the file conf/messages and add format.boolean=Something else.

If you dont want to display anything setting format.boolean to format.boolean= should also work.

For more info: https://www.playframework.com/documentation/2.6.x/ScalaI18N

Option 2

@helper.checkbox(form("subscribe"), '_label -> "Confirm:", '_text -> "Some text", '_help -> "Something")

Where format.boolean gets replaced with the value of _help.

Option 3

You have complete control of what play renders if you want to. To get rid of the format.boolean part and not render it at all do the following:

Custom Form View (view/form/forminput.scala.html):

@(elements: helper.FieldElements)

<div class="field @if(elements.hasErrors) {error}">
    <label for="@elements.id">@elements.label</label>
    @elements.input
    <span class="error">@elements.errors.mkString(", ")</span>
    <!-- The default renders this. To get rid of format.boolean do not include it.  -->
    <!-- <span class="info">@elements.infos.mkString(", ")</--span> -->
</div>

Custom Form Code (forms/common/SemanticForms.scala):

package forms.common
import views.html

object SemanticForms {
  import views.html.helper.FieldConstructor
  implicit val input = FieldConstructor(html.form.forminput.f)
}

Now you just need to import your custom form in your view

@import forms.common.SemanticForms._

This also allows you to change the look and feel of each form!

For more info: https://www.playframework.com/documentation/2.6.x/ScalaCustomFieldConstructors

Upvotes: 4

Related Questions