Thymeleaf dynamic created form input value - forms

I've got form wherefields are generated dynamically, but also I want to put into them values - it's kind a form where user can edit and accept before parsed text. So I'm doing
th:value="${event.value.eventDescription}"
and I got only string representing object like
com.myPackage.model.ConferenceEvent#4a78868b
instead of real description which is inside this object.
Form:
<form action="#" th:action="#{/approveEvents}" th:object="${conferenceTimetable}" method="post">
<table>
<tr>
<td><label>Key</label></td>
<td><label>EventDate</label></td>
<td><label>EventDescription</label></td>
</tr>
<tr th:each="event: *{conferenceTimetableMap}">
<td><span th:utext="${event.key}">Description</span></td>
<td><span th:utext="${event.value.eventDate}">Description</span></td>
<td><input type="text" th:field="*{conferenceTimetableMap[__${event.key}__]}" th:value="${event.value.eventDescription}"/></td>
</tr>
<tr>
<td>
<input type="submit" value="Submit"/>
</td>
</tr>
</table>
</form>

th:field writes the name, value and id of the input it's on. So *{conferenceTimetableMap[__${event.key}__]} is the expressions that evaluates to com.myPackage.model.ConferenceEvent#4a78868b and not ${event.value.eventDescription} (which is never used).
Instead, you should write the complete path to the variable you are submitting in th:field. I can't be sure without know what conferenceTimetableMap contains, but something like this might work:
<input type="text" th:field="*{conferenceTimetableMap[__${event.key}__].eventDescription}" />

Related

I have this code, when submited the form dont refresh, someone know how refresh after submit on october cms?

<form data-request="onSend" data-request-update="'{{ __SELF__}}::attbanco': '#banco' "
data-request-flash >
<table>
<tr>
<td>Nome: </td> <td ><input type="text" id="nome" name="nome"></td>
</tr>
<tr>
<td>Idade: </td> <td ><input type="number" id="idade" name="idade" value="{{usuario.idade}}"></td>
</tr>
<tr>
<td>Telefone: </td> <td ><input type="text" id="telefone" name="telefone" value="{{usuario.telefone}}"></td>
</tr>
</table>
<button type="submit" >Enviar</button>
<input type="hidden" value="{{usuario.id}}" name="id">
this code work, saves the values on database, but i need manually refresh page to see the result on my
screen, someone know how refresh after submit?
Please, explain most simple possible, i am newbie
The best way to do what you want is to put the form in a partial and update it when the form is submitted.
Replace your form with this:
<div id="specialForm">
{% partial __SELF__~"::specialForm" %}
</div>
Create a partial to describe the form; I used specialForm. It should reload the form and clear the content.
<form data-request="onSend" data-request-update="'{{ __SELF__}}::attbanco': '#banco', '{{ __SELF__ }}::specialForm': '#specialForm' "
data-request-flash >
<table>
<tr>
<td>Nome: </td> <td ><input type="text" id="nome" name="nome"></td>
</tr>
<tr>
<td>Idade: </td> <td ><input type="number" id="idade" name="idade" value="{{usuario.idade}}"></td>
</tr>
<tr>
<td>Telefone: </td> <td ><input type="text" id="telefone" name="telefone" value="{{usuario.telefone}}"></td>
</tr>
</table>
<button type="submit" >Enviar</button>
<input type="hidden" value="{{usuario.id}}" name="id">
</form>

Angular 4 - Login Form

I have a login form as such:
<form [formGroup]="loginForm" (ngSubmit)="login();" novalidate>
<table>
<tr>
<td> Username: </td>
<td> <input type="text" formControlName="username"></td>
</tr>
<tr>
<td> Password: </td>
<td> <input type="password" formControlName="password"></td>
</tr>
<tr>
<td> </td>
<td> <button type="submit" [disabled]="loginForm.pristine" md-raised-button>Login</button></td>
</tr>
</table>
</form>
On the submit button, I have [disabled]="loginForm.pristine". But when I type something in either of the input field and backspace to delete everything, it loses it's "pristine" status. How do I handle this?
Taken from the official docs,
"pristine" means the user hasn't changed the value since it was
displayed in this form
Once you start interacting with the form, you loses the "pristine" status. It doesn't matter even if you delete what you type.
I think it would be better to check if the form is valid and disable the button if not.
You can do it like this
<td> <button type="submit" [disabled]="!loginForm.valid" md-raised-button>Login</button></td>

Form doesn't submit on Firefox

<table width=100% cellspacing=0 cellpadding=0 class="form_table">
<form name="suggestion_box" action="suggestion_box.php" method=post>
<input type="hidden" name="form_submit" value="1">
<tr>
<td width=40% align=right valign=top class="form_label_cell">
<b class="form_label">
First Name<br>
</b>
</td>
</table>
<br>
<input type="image" src="button_submit.gif" alt="Submit" class="input_gfx">
<input type="hidden" name="form_submit" value="1">
<br>
</form>
</table>
This is my form, I don't know why that doesn't work with Firefox, can you help me?
I've been reading hundreds of answers since weeks ago, but I couldn't make it work.
1) You can't place your form within the table like that.
2) You are closing your table (</table>) twice.
3) You never closed your row (</tr>).
Try this simplified code instead:
<form name="suggestion_box" action="suggestion_box.php" method=post>
<table width="100%" cellspacing="0" cellpadding="0" class="form_table">
<tr>
<td>
<input type="hidden" name="form_submit" value="1">
</td>
</tr>
<tr>
<td>
<b class="form_label">
First Name
</b>
</td>
</tr>
<tr>
<td>
<input type="submit" src="button_submit.gif" alt="Submit" class="input_gfx">
</td>
</tr>
</table>
</form>
You have to specify a name for your image input field.
<input type="image" name="yourimage" src="button_submit.gif" alt="Submit" class="input_gfx">
You can access the x/y values using the POST variables yourimage.x / yourimage.y (or in PHP yourimage_x, yourimage_y).
I have had problem with forms and inputs which don't have id's, Try giving id's to the form and form elements and add type="submit" to your submit button.

How to identify in table an input (check-box) followed by a text in <td>?

I have to identify the path of check boxes in a row from a table using the text preceding them. The problem is that the text is inserted in a 'td'.
The code is following:
<tr class="bz_row_even">
<td align="center">
<input type="checkbox"
name="email-0-10"
value="1"
checked>
</td>
<td align="center">
<input type="checkbox"
name="email-1-10"
value="1"
checked>
</td>
<td align="center">
<input type="checkbox"
name="email-2-10"
value="1"
checked>
</td>
<td align="center">
<input type="checkbox"
name="email-3-10"
value="1"
checked>
</td>
<td>A new bug is created
</td>
</tr></code></pre>
In this example I have 4 check-boxer for a row. My query should be with a count to check the check-boxes in turn.
Could somebody help me with the path of check-boxes?
Thank you in advance
If you don't use Se-IDE, this becomes much easier. Here I just add the path to a list, but could use get_attribute or similar on the element that is been used.
paths = []
for checkbox in range(se.get_css_count("css=#bz_row_even input"):
paths.append("css=#bz_row_even input[%d]" % checkbox)
Unless I completely misunderstand your question

custom signup "signupXhtml"

Greetings
I'm using the next object to customize the signupXhtml form
The code is the next
object User extends User with MetaMegaProtoUser[User] with ReCaptcha {
............................................
............................................
............................................
override def signupXhtml(user: User) = {
(<form method="post" action={ S.uri }>
<table>
<tr><td colspan="2">{ S.??("sign.up") }</td></tr>
{ localForm(user, false, signupFields) }
<tr><td> </td><td>{ captchaXhtml() }</td></tr>
<tr><td> </td><td><user:submit/></td></tr>
</table>
</form>)
}
............................................
............................................
............................................
}
and the output in html is the next
<form action="/my/signup" method="post">
<table>
<tr><td colspan="2">Sign Up</td></tr>
<tr>
<td>Username</td>
<td>
<input id="txtFirstName" name="F443739586660TOG" type="text" maxlength="32" value="" />
</td>
</tr>
<tr>
<td>Lastname</td>
<td>
<input id="txtLastName" name="F443739586661IYO" type="text" maxlength="32" value="" />
</td>
</tr>
<tr>
<td>email</td>
<td>
<input id="txtEmail" name="F443739586662Z43" type="text" maxlength="48" value="" />
</td>
</tr>
<tr>
<td>passwd</td>
<td>
<span>
<input value="*******" type="password" name="F443739586663IFM" /> Repeat
<input value="*******" type="password" name="F443739586663IFM" />
</span>
</td>
</tr>
...............................................
</table>
</form>
I need to customize the email field, as follows:
<input id="txtEmail" name="F443739586662Z43" type="text" maxlength="48" value="" onblur="return my_function();"/>
How insert onblur="return my_function();" on txtEmail element ?
I was reviewing:
http://scala-tools.org/mvnsites/liftweb-2.0/framework/lift-persistence/scaladocs/net/liftweb/mapper/ProtoUser.scala.html#Some%2896%29
and this:
http://www.devcomments.com/Example-custom-registration-at1131253.htm
but did not find anything to help me
anyone have any idea?
please!
I know that you can attach script commands to most of the built in ajax elements in lift by passing the script as an argument when you create an SHTML.text element. Lifts wiring is also something you might want to look into, I know that the Lift In Action has a chapter that goes into detail about attaching javascript to ajax elements and about wiring as well so that is something that you could look into. You could also post this to the mailing list or take a look through it, it will probably provide the best results
In your User class do something like:
override lazy val email = new CustomizedEmailField
protected class CustomizedEmailField(obj: User, size: Int) extends EmailField(obj, size) {
override def toForm: Box[NodeSeq] =
Full(SHtml.text("example#email.com", (s) => Alert("hello "+s), ("onblur", "callMyFunc();")))
}
This should override the default email field.