adrianhurt / play-bootstrap Goto Github PK
View Code? Open in Web Editor NEWA Play Framework library for Bootstrap
Home Page: https://adrianhurt.github.io/play-bootstrap/
License: Apache License 2.0
A Play Framework library for Bootstrap
Home Page: https://adrianhurt.github.io/play-bootstrap/
License: Apache License 2.0
Would you be able to make a copy of this library that compiles with "enablePlugins(PlayJava)" rather than "enablePlugins(PlayScala)"? I tried it myself but I don't have enough experience with sbt to resolve all the compilation issues.
This would be very helpful to people who are creating Play java projects but are using a different build tool (e.g. gradle). Otherwise, there are compilation issues when including your library with a Java play project.
Hi - really appreciate all your work on play-bootstrap!
Is it possible to post working code examples for the multicheckbox helper for play 2.4.x and Java? Your advice to remove the implicit Messages var (to avoid conflict with PlayMagicForJava) is helpful but incomplete and I don't have the scala skills to figure out the solution. (Does seem to complile for the textwithCheckbox and datepicker helpers though!)
For example - with this version of multicheckbox.scala.html, where I have removed the implicit messages var
@(fieldsWithArgs: (Field, Seq[Symbol,Any]))(globalArgs: (Symbol,Any))(implicit fc: b3.B3FieldConstructor)
@b3.multifield(fieldsWithArgs.map(_.1):__)(globalArgs, fieldsWithArgs.map(._2).flatten) { implicit cfc =>
play gives a "wrong number of type arguments for Seq, should be 1": for lines 1, 5 and 8.
I use the latest snapshot (1.0-P24-SNAPSHOT) with BS3.
I have a form field named "zip" (part of an address).
When I write
@b3.text(myForm("zip"), ...)
I get:
play.api.http.HttpErrorHandlerExceptions$$anon$1: Execution exception[[ClassCastException: java.lang.String cannot be cast to scala.Function0]]
at play.api.http.HttpErrorHandlerExceptions$.throwableToUsefulException(HttpErrorHandler.scala:265) ~[play_2.11-2.4.6.jar:2.4.6]
at play.api.http.HttpErrorHandlerExceptions.throwableToUsefulException(HttpErrorHandler.scala) ~[play_2.11-2.4.6.jar:2.4.6]
at play.http.DefaultHttpErrorHandler.throwableToUsefulException(DefaultHttpErrorHandler.java:169) ~[play_2.11-2.4.6.jar:2.4.6]
at play.http.DefaultHttpErrorHandler.onServerError(DefaultHttpErrorHandler.java:131) ~[play_2.11-2.4.6.jar:2.4.6]
at play.core.j.JavaHttpErrorHandlerAdapter$$anonfun$onServerError$1.apply(JavaHttpErrorHandlerAdapter.scala:22) [play_2.11-2.4.6.jar:2.4.6]
at play.core.j.JavaHttpErrorHandlerAdapter$$anonfun$onServerError$1.apply(JavaHttpErrorHandlerAdapter.scala:22) [play_2.11-2.4.6.jar:2.4.6]
at play.core.j.JavaHelpers$$anonfun$invokeWithContext$1.apply(JavaHelpers.scala:140) [play_2.11-2.4.6.jar:2.4.6]
at play.core.j.JavaHelpers$$anonfun$invokeWithContext$1.apply(JavaHelpers.scala:139) [play_2.11-2.4.6.jar:2.4.6]
at play.core.j.JavaHelpers$class.withContext(JavaHelpers.scala:151) [play_2.11-2.4.6.jar:2.4.6]
at play.core.j.JavaHelpers$.withContext(JavaHelpers.scala:160) [play_2.11-2.4.6.jar:2.4.6]
Caused by: java.lang.ClassCastException: java.lang.String cannot be cast to scala.Function0
at views.html.bs.package$BSFieldInfo$$anonfun$constraintsArgs$1.apply(package.scala:149) ~[play-bootstrap-core_2.11.jar:1.0-P24-SNAPSHOT]
at views.html.bs.package$BSFieldInfo$$anonfun$constraintsArgs$1.apply(package.scala:143) ~[play-bootstrap-core_2.11.jar:1.0-P24-SNAPSHOT]
at scala.collection.TraversableLike$$anonfun$map$1.apply(TraversableLike.scala:245) ~[scala-library-2.11.7.jar:na]
at scala.collection.TraversableLike$$anonfun$map$1.apply(TraversableLike.scala:245) ~[scala-library-2.11.7.jar:na]
at scala.collection.mutable.ResizableArray$class.foreach(ResizableArray.scala:59) ~[scala-library-2.11.7.jar:na]
at scala.collection.mutable.ArrayBuffer.foreach(ArrayBuffer.scala:48) ~[scala-library-2.11.7.jar:na]
at scala.collection.TraversableLike$class.map(TraversableLike.scala:245) ~[scala-library-2.11.7.jar:na]
at scala.collection.AbstractTraversable.map(Traversable.scala:104) ~[scala-library-2.11.7.jar:na]
at views.html.bs.package$BSFieldInfo$.constraintsArgs(package.scala:143) ~[play-bootstrap-core_2.11.jar:1.0-P24-SNAPSHOT]
at views.html.bs.package$BSFieldInfo.innerArgsMap$lzycompute(package.scala:89) ~[play-bootstrap-core_2.11.jar:1.0-P24-SNAPSHOT]
When I change it to "zip1" or something differnt it works.
E.g. when writing
@b3.text(..., 'class -> "custom-class", ...)
@b3.select(..., 'class -> "custom-class", ...)
etc.
then NO form-control
class is rendered.
As a fix I have to write
@b3.text(..., 'class -> "form-control custom-class", ...)
I suggest @b3.* controls always should add the corresponding bootstrap form-control
class, no matter if we define 'class -> "...".
Also see #25 which is similar (it was for <form>
tags).
Hi. When trying to use play-bootstrap 1.1-P25-B3 with Play 2.5.6 in Java to create a form, I get this two compilation errors in Eclipse:
could not find implicit value for parameter messages: play.api.i18n.Messages
and
not enough arguments for method apply: (implicit fc: views.html.b3.B3FieldConstructor, implicit messages: play.api.i18n.Messages)play.twirl.api.HtmlFormat.Appendable in class textarea. Unspecified value parameter messages.
Odd enough, even with this errors the form work without problem and as intended. The thing is that if I try to pass an (implicit messages : Messages)
in a try to solve the first errors, I get this compilation error ALONG with the other 2 and nothing works anymore:
ambiguous implicit values:
both method implicitJavaMessages in object PlayMagicForJava of type => play.api.i18n.Messages
and value messages of type play.api.i18n.Messages
match expected type play.api.i18n.Messages
I tried various solution without any luck. Am I doing something wrong or have something to do with play-bootstrap and Java? Here's my template code:
@(productForm: Form[Product])
@import b3.vertical.fieldConstructor
@main("Product Form") {
<h1>Product Form</h1>
@b3.form(routes.ProductsController.save()) {
<fieldset>
@b3.text(productForm("ean"), '_label -> "EAN")
@b3.text(productForm("name"), '_label -> "Name")
@b3.textarea(productForm("description"), '_label -> "Description", 'rows -> 3 )
</fieldset>
@b3.submit('class -> "btn btn-primary"){ <span class="glyphicon glyphicon-ok"></span> Save }
@b3.button('class -> "btn btn-danger", 'href -> "@routes.Products.index()"){ <span class="glyphicon glyphicon-remove"></span> Cancel }
}
}
When you want to add a HTML attribute with a dash, it will fail. E.g. to add a HTML5 data attribute:
@b3.text(myForm("firstname"), 'data-somehtml5data -> "myvalue")
This will fail with a compiler error.
To make this work you have to use this import:
@import views.html.helper.Implicits._
or add the import to the build.sbt
so it is used in every template automatically:
TwirlKeys.templateImports += "views.html.helper.Implicits._"
Then you can write:
@b3.text(myForm("firstname"), "data-somehtml5data" -> "myvalue")
Now it works.
I think it would make sense to document this and point it out in the documentation, because it took me a while to figure this out and probably more people could (will?) get stuck at this point.
Thanks!
Sources: Issue from Playframwork which got fixed by this PR.
Hello,
I was wondering if there are any issues preventing a non-snapshot 0.4 release? Happy to try and chip in if there are any blockers, but can't see anything on the issues list.
Apologies for opening this as an issue, but didn't know how else to get in touch.
Thanks for the library, it's been really handy.
Phil
This dependency:
"com.adrianhurt" % "play-bootstrap3_2.11" % "0.4.5-P24"
When I run activator, causes this exception:
java.lang.NoSuchMethodException: play.core.server.NettyServer.mainDevHttpMode(play.core.BuildLink, play.core.BuildDocHandler, int)
at java.lang.Class.getMethod(Class.java:1773)
at play.PlayRun$class.play$PlayRun$$startDevMode(PlayRun.scala:318)
at play.PlayRun$$anonfun$playRunTask$1$$anonfun$apply$2$$anonfun$apply$3.devModeServer$lzycompute$1(PlayRun.scala:103)
at play.PlayRun$$anonfun$playRunTask$1$$anonfun$apply$2$$anonfun$apply$3.play$PlayRun$class$$anonfun$$anonfun$$anonfun$$devModeServer$1(PlayRun.scala:103)
at play.PlayRun$$anonfun$playRunTask$1$$anonfun$apply$2$$anonfun$apply$3.apply(PlayRun.scala:125)
at play.PlayRun$$anonfun$playRunTask$1$$anonfun$apply$2$$anonfun$apply$3.apply(PlayRun.scala:96)
at scala.Function1$$anonfun$compose$1.apply(Function1.scala:47)
With scalaVersion := "2.11.1"
and sbt launcher version 0.13.5
.
When the dependecy is removed, the project runs.
The bug can be reproduced by running the following project: https://github.com/JUGItalia/JUG_Events
Hello,
I'm stuck with my forms and validation error / success.
is it normal that "has-success" is mount on the reply from server only when "showIconValid" is set at true ?
I don't want this icon, so my css prevent it from being displayed but it seems a little overkill.
When I displayed the form for the first time, I want the field to be black, not having "has-success" (technically, I understand there is no error, but there is no result also). Is it possible to display has-success when the form is re-submitting and nothing when it is the first time ?
Thanks
PS : I use (but I'm not sure it is very relevant)
@b3.text( form("user.lastName"), '_label -> Messages("form.last.name"), 'placeholder -> Messages("form.last.name"),'_showIconValid -> true)
Especially useful on controls with no placeholder (eg: date).
Thank you.
Hi everyone,
There's only one example of an input type file in the Bootstrap documentation, and it does not have a "form-control" class. And this class is not applied to radios, checkboxes, nor selects. So it's easy to bypass this by setting the b3.file class to "", like this:
@b3.file(form("file"), 'class -> "")
Would it be right to just not apply this class to this type of input?
Hi!
The only button you provide is @b3.submit
, which is a <button></button>
of type="submit"
.
Just now I wanted to add a "normal" button, but I would have to use @b3.actions {...}
for this.
Suggestion:
We should add
@b3.reset
which is a <button></button>
of type="reset"
and
@b3.button
which is a <button></button>
of type="button"
(needs to be explicitly set, see here why).
"help wanted"
This is really just a question (not necessarily an issue) but I can't find a way to just send a message...
How do I use the list / repeat functions that "normal" play helpers support together with the b3 helpers?
btw. I really like the play-bootstrap3 project, thanks for sharing!
We are having a problem with glyphicons in 1.0-P25-B3. It's not big (you can work around it), but we'd like to have only ONE CSS file, so it's an issue for us:
I have two projects. In one, I include Bootstrap from my HTML code and all Glyphicons work. In another, we @include the *.less files from our backend.less file. Now the path to the font files is invalid and the glyphicons aren't working anymore.
The workaround would be to include Bootstrap CSS-files from HTML, but we'd like to only have one request to a CSS-file.
I'm afraid this might also be a problem with Webjars bootstrap.
I am using a Play Java project.
I followed the instructions here to create my own email helper. I created the exact same file app/views/b3/my/email.scala.html
like you described in the docs.
Running the app gives me:
play.sbt.PlayExceptions$CompilationException: Compilation error[ambiguous implicit values:
both method implicitJavaMessages in object PlayMagicForJava of type => play.api.i18n.Messages
and value messages of type play.api.i18n.Messages
match expected type play.api.i18n.Messages]
at play.sbt.PlayExceptions$CompilationException$.apply(PlayExceptions.scala:27) ~[na:na]
at play.sbt.PlayExceptions$CompilationException$.apply(PlayExceptions.scala:27) ~[na:na]
at scala.Option.map(Option.scala:145) ~[scala-library-2.11.6.jar:na]
at play.sbt.run.PlayReload$$anonfun$taskFailureHandler$1.apply(PlayReload.scala:49) ~[na:na]
at play.sbt.run.PlayReload$$anonfun$taskFailureHandler$1.apply(PlayReload.scala:44) ~[na:na]
at scala.Option.map(Option.scala:145) ~[scala-library-2.11.6.jar:na]
at play.sbt.run.PlayReload$.taskFailureHandler(PlayReload.scala:44) ~[na:na]
at play.sbt.run.PlayReload$.compileFailure(PlayReload.scala:40) ~[na:na]
at play.sbt.run.PlayReload$$anonfun$compile$1.apply(PlayReload.scala:17) ~[na:na]
at play.sbt.run.PlayReload$$anonfun$compile$1.apply(PlayReload.scala:17) ~[na:na]
Whats the problem and how to work around? (Likely this only occurs in Java Projects?)
When using a field called email
with some constraints (e.g. @Required
, @Email
, @MinLength(3)
, etc.) and displaying this field with
@b3.email(myForm("email"), '_label -> "Enter your E-Mail:", '_showConstraints -> true, '_help -> "This is a help text")
the help text gets displayed twice but no constraints help text is shown!
As soon as I remove the 'help_ -> ...
text, only the constraints text is shown, which is correct. Also when setting '_showConstraints -> false
or by removing it, the help text is displayed only once, like expected.
Hi!
When using
@b3.password(myForm("password"), '_label -> "Enter Password")
and validation fails, then the password which was entered will be send from the server back to the browser which then stores it in the DOM.
This is very bad practice and should be avoided. There are many reasons for this, e.g. the page could get cached or someone could just walk away from the machine, leaving the browser open, believing everything is save (because he/she did not log in), not knowing his/her password is in the DOM.
Right now I use:
@b3.password(myForm("password").copy(value=Some("")), '_label -> "Enter Password")
to work around this issue.
Shouldn't this be handled by default in the library?
I also googled, an basically everywhere people highly recommend not to send back the password. (Also I don't know any single site which works this way).
Hi!
Play 2.4.0 RC2 was released already.
Could you please also release a snapshot or milestone with Play 2.4 support?
Thanks!
Is it possible to use hash map as select options?
Building a Play 2.4 application with the 0.4.5-P24-SNAPSHOT started to fail since today. I've checked and it looks like the Jar is not available anymore at Sonatype repo:
https://oss.sonatype.org/content/repositories/snapshots/com/adrianhurt/play-bootstrap3_2.11/
Since today I started getting:
[warn] ::::::::::::::::::::::::::::::::::::::::::::::
[warn] :: UNRESOLVED DEPENDENCIES ::
[warn] ::::::::::::::::::::::::::::::::::::::::::::::
[warn] :: com.adrianhurt#play-bootstrap3_2.11;0.4.5-P24-SNAPSHOT: not found
[warn] ::::::::::::::::::::::::::::::::::::::::::::::
[warn]
[warn] Note: Unresolved dependencies path:
[warn] com.adrianhurt:play-bootstrap3_2.11:0.4.5-P24-SNAPSHOT
Following the "Installation" instructions mentioned here:
http://play-bootstrap3.herokuapp.com/
And the example here:
https://github.com/adrianhurt/play-bootstrap3/blob/master/sample/build.sbt
My build.sbt contains:
resolvers += "Sonatype OSS Snapshots" at "https://oss.sonatype.org/content/repositories/snapshots/"
and
libraryDependencies ++= Seq(... , "com.adrianhurt" %% "play-bootstrap3" % "0.4.5-P24-SNAPSHOT")
Nothing changed in the code, it just started failing today.
Hi!
I think it would make sense to always lookup certain arguments in the messages.
This would be
'_label
'placeholder
'_text
(for checkboxes)
Hi!
@b3.static("Any label", '_hideLabel -> true){Some text}
The class sr-only
is missing. The label is still displayed.
The modules directory from the play framework website said that this works for Java or Scala.
I tried to get this to work in twirl templates in play java framework 2.4.6 and I'm getting compilation errors asking me to change a lot of the parameter types in the field constructors or package.scala files to Java types.
Could you kindly explain how to fix?
Thanks.
See here:
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/optgroup
What do you think?
I'm using this plugin with Play!2.
I add the dependencies with:
<link rel="stylesheet" media="screen" href="@routes.Assets.versioned("lib/bootstrap/css/bootstrap.min.css")">
<link rel="stylesheet" media="screen" href="@routes.Assets.versioned("lib/bootstrap/css/bootstrap-theme.min.css")">
<script src="@routes.Assets.versioned("lib/jquery/jquery.min.js")" type="text/javascript"></script>
<script src="@routes.Assets.versioned("lib/bootstrap/js/bootstrap.min.js")" type="text/javascript"></script>
When I place a button with:
<a class="btn btn-primary" href="@controllers.routes.TripRequestController.show(tripRequest.getId.toString)" role="button">
Show</a>
I get the button with the follow look
But I want to have the look on your page and bootstraps', like:
Is something defining a different theme?
E.g.
@b3.static(null){
something
}
renders an empty <label class="control-label col-md-X"></label>
instead of using the col-md-offset-
approach.
In b3FieldConstructorHorizontal.scala.html in line 17-18 the help text is printend in raw format via @Html()
and you use the syntax case help: String =>
.
But in b3FieldConstructorVertical.scala.html, b3FieldConstructorInline.scala.html and multifield.scala.html you do not use @Html()
which escapes the help text (and also don't use the case help: String =>
syntax).
Either the help text should be raw everywhere or escaped everywhere.
I can provide a pull request if we decide which one we prefer.
@adrianhurt What do you think?
Your HTML5 data form validation is a great feature. There is only one case where, in my experience, it shouldn't apply. When a user defines a password, if the password is longer than the input field can contain, the user won't be able to see that his input is being truncated, if you set a max length.
Of course, this can be avoided by simply not setting a max length on this particular form field. But, if it is considered bad practice, shouldn't we just not permit it? It might spare some fellows an unpleasant situation? What do you think?
Like in the official Bootstrap documentation it should be possible to directly jump to an heading/section of the documentation itself.
E.g. when going to http://getbootstrap.com/css/#forms-horizontal the browser directly takes me to the "Horizontal form"
heading/section.
Please also add id
's to all the headings in your documentation, so we can easily jump to sections.
E.g. when going to http://play-bootstrap3.herokuapp.com/horizontal#more-options we should be taken to the "More options"
heading. Just add:
<h3 id="more-options">More options</h3>
... and so on.
Thanks!
One possibility is to interpret the _2 in the list options as Html.
I would like to add data-*
attributes to each of the the <option>...</option>
elements of the @b3.select(...)
control.
But it seems it is not possible right now, because the options
param has to be of type Seq[(String,String)]
(for value
and label
only).
I want to have a result like:
<select id="foo" name="foo" class="form-control">
<option class="blank" value="">Select an option</option>
<option value="A" data-calories="54">Apples</option>
<option value="P" data-calories="58">Pears</option>
<option value="B" data-calories="89">Bananas</option>
</select>
Hi! Play 2.5 was released yesterday.
Hi,
if I use a button as example:
@b3.submit('class -> "btn btn-primary btn-block", 'id -> "search"){@page("search")}
then this produces a form group with an empty ID:
<div class="form-group " id="">
<button type="submit" class="btn btn-primary btn-block" id="search">Suchen</button>
</div>
This problem occurs also with compounded fields (date range). Normally empty id attributes shouldn't be added, because this leads to validation errors.
Best regards,
Christian
Hi,
In a multilingual application, it seems that error messages are always printed in English.
Is it just me?
Hi @adrianhurt
Please have a look at:
playframework/playframework#5399
It changes Play's own @helper.select(...)
tag
Does this change somehow influence play-bootstrap? Do you use the Play helper tags?
If not, just close this issue.
I use v1.0 for play 2.4 and Bootstrap 3.
I have an array of checkbox of name transports[id] and value id, but I can't find how to check or not check the value from the form value.
The choices displayed by the checkbox is from a model transports where there is an id and a name (text value).
I tested
views :
@b3.checkboxgroup( transports.map { case ((id, name)) => (searchForm(s"transports[$id]"), Seq(('_text -> name),('value -> id))) }.toSeq: _*)('_label -> Messages("form.filter.transport.type"), 'class -> "multi-checkbox-list")(b3.inline.fieldConstructor, implicitly[Messages])
and
B3/checkboxgroup.scala.html
@(fieldsWithArgs: (Field, Seq[(Symbol,Any)])*)(globalArgs: (Symbol,Any)*)(implicit fc: b3.B3FieldConstructor, messages: Messages) @b3.multifield(fieldsWithArgs.map(_._1):_*)(globalArgs, fieldsWithArgs.map(_._2).flatten) { implicit cfc => <div @toHtmlArgs(bs.Args.inner(globalArgs).toMap)> @fieldsWithArgs.map { case (field, fieldArgs) => @b3.checkbox(field, fieldArgs:_*) } </div> }
and in the views, all my checkbox are always checked. Even if I write ('checked -> "false") on the arguments, the result is always the same.
Is it normal because I don't use correctly the library or is it a bug ?
(I'm not very fluent in writing english, i'm sorry)
This form...
@b3.form(routes.Application.login) {
}
... renders to following HTML (here the vertical field constructor was used, but it does not matter which field constructor you use):
<form action="/" method="GET" class="form-vertical" role="form">
</form>
But now when adding a class to the form, the bootstrap form-*
classes are missing (in my example it is form-vertical
):
@b3.form(routes.Application.login, 'class -> "myclass") {
}
becomes:
<form action="/" method="GET" class="myclass" role="form">
</form>
As you can see only myclass
gets used, but form-vertical
is gone! Right now I have to add the form-vertical
css class by my own - which IMHO is very bad. If I change a @b3.inline.form
to a @b3.horizontal.form
I do not want to think about to also change the css class...
I suggest @b3.form.*
(or @b3.vertical.form
, @b3.inline.form
, etc., whatever) always should add the corresponding bootstrap form class, no matter if we define 'class -> "..."
.
Hi again,
This is not an issue. As the title says, I want to limit the size of an input in a horizontal form, without reducing the size of the div that contains it, because it can contain help blocks that shouldn't be cut in width.
As you can see in this screen shot, the "CP" (zip code) field is smaller than the other ones. And because of this, the size of the error message is limited to the width of the field.
I got round this by setting a fixed size to the input:
@b3.text(form("zipCode"), '_label -> "CP *", 'style -> "width:130px !important")
But it wouldn't work if I wanted it to use a "col-xx-xx" class to define its size, because of the "form-control" class which sets the width to 100%.
Does anyone has run into this one?
When _label
is None
do not render the <label>
element - instead use the col-md-offset-*
class for positioning.
E.g. in http://play-bootstrap3.herokuapp.com/horizontal have a look at these lines:
@b3.text( fooForm("foo"), '_label -> None, 'placeholder -> "Without label" )
@b3.checkbox( fooForm("foo"), '_label -> None, '_text -> "Checkbox", 'checked -> true )
@b3.checkbox( fooForm("foo"), '_label -> None, '_text -> "Readonly checkbox", 'readonly -> true, 'value -> true )
As a sample lets look at what the first line of the above 3 becomes when it's rendered:
<div class="form-group" id="foo_field">
<label class="control-label col-md-2" for="foo"></label>
<div class="col-md-10">
<input type="text" id="foo" name="foo" value="" class="form-control" placeholder="Without label">
</div>
</div>
This is not the best solution as there is an empty <label>
. Instead it should be:
<div class="form-group" id="foo_field">
<div class="col-md-offset-2 col-md-10">
<input type="text" id="foo" name="foo" value="" class="form-control" placeholder="Without label">
</div>
</div>
This is the same like how Bootstrap solves it in the official docs: http://getbootstrap.com/css/#forms-horizontal (Look at the last 2 elements, the "Remember me" checkbox and the "Sign in" button, which both do not have a label).
When _label
is None
just do not render the <label>
element. Even when _showLabel
is true
- because it also make no sense in this case either.
Everyhing is ok already.
Hi,
We've been using your library for over a month now. And it's cool and simple. But our build just broke.
But when you adding new functionality, you need to create a new branch and name it. Not like this...
So, sorry to inform you, but we are switching to plays default helper and manually setting bootstrap.
That way, we know that the versions are stable and won't broke our app.
cheers!
Are there any examples how to use radio
or checkbox
with boolean properties? In the documentation I can read that the radio and checkbox only have Seq[(String, Any)]
and thus not allowed to pass boolean.
Btw: I am using your lib a Java project...
Maybe I'm doing something wrong but I can't figure out what:
@b3.checkbox( fooForm("myCheckbox"), 'value -> "test")
Translates to:
<div class="form-group " id="myCheckbox_field">
<div class="checkbox">
<label for="myCheckbox">
<input id="myCheckbox" name="myCheckbox" value="true" type="checkbox">
</label>
</div>
</div>
If I add the readonly option, the hidden field will have the correct value:
<div class="form-group " id="myCheckbox_field">
<div class="checkbox checkbox-group disabled">
<label for="myCheckbox">
<input id="myCheckbox" name="myCheckbox" value="true" disabled="true" readonly="true" type="checkbox">
</label>
<input name="myCheckbox" value="test" type="hidden">
</div>
</div>
If you can confirm this is a bug, I'd be glad to fix it and submit a PR.
Thanks for your work by the way.
In one of your examples you are using the following code:
@b3.selectOption(citrus.id, citrus.name, 'selected -> (citrus.name == "Lemon"))
This renders:
<option value="4" selected="true">Lemon</option>
But according to the W3Spec a boolean attribute does not allow the values true
or false
. But Firefox and Safari do allow this and they render it correctly, Chrome also with <optgroup>
.
I think it should be:
<option value="4" selected>Lemon</option>
or
<option value="4" selected="selected">Lemon</option>
See also Stackoverflow question.
I cannot force a checkbox to be unchecked despite passing 'checked -> false
.
Looking at the checkbox helper I think the issue could be with this line.
val checked = argsMap.get('checked).orElse(field.value.map(_ == value).orElse(argsMap.get('_default))).map(_.toString == "true").getOrElse(false)
If I specifically pass checked as false then val checked
should be set to false and continue,
I am not sure if this is intended or not? If it is how can I override it? I have tried creating my own checkbox.scala.html but it doesn't make any difference.
Thanks,
Rob.
`@b3.formCSRF(action = routes.Employees.save_import(), 'enctype -> "multipart/form-data") {
<div class="form-group" id="picture_field">
<label for="picture">picture</label>
<input type="file" name="picture" id="picture" value="">
<p class="help-block">Upload picture.</p>
</div>
<input type="submit" class="btn btn-primary" value="Import">
}`
I get the error "Invalid CSRF token found in form body" when submitting.
This is due to the fact that play2 checks the multipartform per 100kb. If the file is larger than 100kb the CSRF-token is not in the first part and play2 gives the error. I think this can be solved by adding the hidden CSRF-field at first.
I'm wondering if people would be interested in having a constructor for global errors? A Bootstrap-themed version of this (copied from Play documentation):
@if(userForm.hasGlobalErrors) {
<ul>
@userForm.globalErrors.foreach { error =>
<li>error.message</li>
}
</ul>
}
Hi,
I just started to use your library but I'm having a compilation problem. I use Play Framework
in its 2.5 version, and I added the play-bootstrap
dependency in my build.sbt
file :
"com.adrianhurt" %% "play-bootstrap" % "1.0-P25-B3"
Here is what I have in my template:
@import models.FareData
@import b3.vertical.fieldConstructor
@(fareForm: Form[FareData])(implicit messages: Messages)
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="@routes.Assets.at("stylesheets/index.css")">
</head>
<body>
<div id="container">
@b3.form(routes.WebsiteController.computeFarePrice()) {
@b3.email( fareForm("email"), '_label -> "Email", 'placeholder -> "[email protected]" )
@b3.password( fareForm("password"), '_label -> "Password", 'placeholder -> "Password" )
@b3.checkbox( fareForm("remember"), '_text -> "Remember me", 'value -> true )
@b3.submit('class -> "btn btn-default"){ Sign in }
}
</div>
</body>
</html>
When I compile my sources, Play tells me that I can't use b3 helpers (Compilation error[not found: value b3]
)
play.sbt.PlayExceptions$CompilationException: Compilation error[not found: value b3]
at play.sbt.PlayExceptions$CompilationException$.apply(PlayExceptions.scala:27)
at play.sbt.PlayExceptions$CompilationException$.apply(PlayExceptions.scala:27)
at scala.Option.map(Option.scala:145)
at play.sbt.run.PlayReload$$anonfun$taskFailureHandler$1.apply(PlayReload.scala:49)
at play.sbt.run.PlayReload$$anonfun$taskFailureHandler$1.apply(PlayReload.scala:44)
at scala.Option.map(Option.scala:145)
at play.sbt.run.PlayReload$.taskFailureHandler(PlayReload.scala:44)
at play.sbt.run.PlayReload$.compileFailure(PlayReload.scala:40)
at play.sbt.run.PlayReload$$anonfun$compile$1.apply(PlayReload.scala:17)
at play.sbt.run.PlayReload$$anonfun$compile$1.apply(PlayReload.scala:17)
How can i add values to a select dynamically? I need to load the values to a select based on the values of another select box. How can i load values to the select, with the JSON that i receive in the AJAX call?
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.