Adding HTML5 placeholder attribute to spring 3.0 form input elements - spring

How do I add HTML5 placeholder attributes to Spring webmvc's form:input, form:password and form:textarea elements?

As of Spring 3.0 form tags support dynamic attributes, therefore you can simply write
<form:input placeholder = "..." ... />

Regarding the new input types question - I had success by using spring bind and manually generating the input element. I'm using bootstrap so I already had a tag to wrap the control-group and apply the error message, but if you just want to inline it you can do the following.
if your path field was 'age', replace <form:input path="age"/> with
<spring:bind path="age">
<input id="age" name="age" type="number" value="${status.value}" />
</spring:bind>

Related

Formik Field - how to CSS format the inbuilt <input> component

New to Formik. I am trying to CSS format the field that will be emitted by Formik , but am coming up short. Is wrapping each Field with a the right approach? I was hoping to pass a style attribute to but it doesnt accept one.
You can pass className="your-class", and then style the class as needed.
<Field
className="main"
type="number"
name="numberInput"
... other props here ...
/>
will give you:
<input name="numberInput" class="main" type="number">

Autocomplete datalist on Thymeleaf

I'm building a view with Thymeleaf templates, which contains a form that provides a way to bind the value of my inputs with the attributes passed in the model. The backend was developed using Spring 4.
The following snippet includes an autocomplete datalist with the data of the namelist object, which was added to the model as an attribute. Said namelist is an ArrayList of a class with the fields int id and String name.
<form th:action="#{/}" method="POST" th:object="${example}">
<div class="form-group">
<input list="names" class="form-control" id="nameinput" th:field="${example.num.id}"> </input>
<datalist id="names">
<option th:each="row : ${namelist}" th:value="${row.id}" th:label="${row.name}">
</datalist>
<button>submit</button>
</div>
</form>
The value of the selected option is already bound to example.num.id, which is the expected and desired behaviour. However, when loading the view on a web browser (tested on latest Firefox and Chrome), it is represented like this:
As you can see, the id's are showing. However, I'm trying to emulate the behaviour of a <select>; the value should not be shown, just the text or label.
Is there a better way to achieve this? Am I not using the datalist properly?

Spring Thymeleaf - Conditional Expressions in th:field

Conditional Expression (docs):
<tr th:class="${row.even}? 'even' : 'odd'">
I want to use conditional expression within a th:field. But every time I try it I get the following error:
*only variable expressions ${...} or selection expressions {...} are allowed in Spring field bindings
For example:
// This works fine.
<input type="text" th:value="${object.covered} ? 'yes' : 'no'" />
// This on the other hand, generates the error mentioned earlier.
// Which does make sense, cause it would otherwise generate invalid attributes.
<input type="text" th:field="${object.covered} ? 'yes' : 'no'" />
// Combining the two does not work.
<input type="text" th:field="${object.covered}" th:value="${object.covered} ? 'yes' : 'no'" />
Basically, what I want, is to create a th:field where its value is determined by a conditional expression.
More specific, In my implementation I want to populate a input field with a number (Java long) from my model. And if that number is zero or lesss, I want to use a placeholder instead.
// Ultimateley, what I want to achieve is something like this.
<input type="text" th:field="${person.age}"
th:value="${person.age} le 0 ? null : ${person.age}"
placeholder="age" />
How to use th:field, and determine its value with a conditional expression with Spring Thymeleaf?
(Thymeleaf 2.1.5, and Spring Boot 1.4.2)
Thymeleaf th:field generates 3 html attributes id, name an value.
For your case, instead of using th:field, use id, name and placeholder when age is less than zero, as shown below
<input th:if="${person.age > 0}" type="text" th:field="${person.age}" />
<input th:if="${person.age <= 0}" type="text" id="person.age" name="person.age" placeholder="age"/>

Prototype 1.7: Is there a way to serialize elements outside of form?

In Prototype, is there a way to serialize all 'input' elements on the page after looking up using $$? I have to work with some pages that don't have any forms or some elements are outside of form hence cannot use Form.serialize or Form.serializeElements.
Actually you can use Form.serialzeElements() outside of a form you just need to pass it a list of elements.
For example
HTML
<input type="text" name="a" id="a" value="12345" />
<input type="text" name="b" id="b" value="6789" />
Javascript
Form.serializeElements($$('input'))
returns
a=12345&b=6789
try it out in this jsfiddle http://jsfiddle.net/av5Kj/

Struts 2 validation resets my dynamic data

I'm trying to validate a form and it works well, the right messages appear...
My only problem is that my form fields are deleted if there are some errors.
Datas are taken by Database and be showed in forms with struts tags (so they're dynamic). If I put sono static value, that will not deleted after a wrong validation.
<s:form action="updateUser" method="post" id="updateUser"
name="updateUser" >
<s:textfield value="%{user.name}" class="modify" id="name" name="name" key="modify.name" required="true" />
this will be deleted while this:
<s:textfield value="HELLO" class="modify" id="name" name="name" key="modify.name" required="true" />
will not.
Any advice?
Have you set a User object in your Action Class? Do you have getters/setters for that object? Also how have you configured the "input" result of this action in struts.xml? Maybe you should use "chain" in result of INPUT (i guess this is the result you get from the validator.)

Resources