Convert Spring checkboxes to Spring submit buttons - spring

Below Spring form submits data to a Spring controller and works as expected.
How can I convert the checkboxes to buttons ? So instead of three checkboxes : 'isTest1,isTest3,isTest3' three buttons are displayed.
This then means instead of having one submit button I have three submit buttons with each button.
Here is my form currently :
<form:form method="post" modelAttribute="searchobj" action="redirect">
<table>
<tr>
<td><form:input path="param" /></td>
<td><input type="submit" value="Search"/></td>
</tr>
</table>
<table>
<td>isTest1</td>
<td><form:checkbox path="isTest1" /></td>
<td>isTest2</td>
<td><form:checkbox path="isTest2" /></td>
<td>isTest3</td>
<td><form:checkbox path="isTest3" /></td>
</tr>
</table>
</center>
</form:form>
I've tried linking the form directly to the submit button so instead of
<td><form:checkbox path="isTest1" /></td>
use
<td><input type="submit" value="isTest1"/></td>
but I dont how to access the value in the controller ?

I used :
<form:input type="submit" path="myPath" value="Tester"/>

Related

float field value displaying as 0.0 always in spring boot

I am new to spring boot and I created a form using thymeleaf. There I have a float value field and that is always displaying 0.0 like a placeholder. I don't want to display a value for that. How can I solve this issue?
<form action="#" th:action="#{/save}" th:object="${product}" method="post">
<table border="0" cellpadding="10">
<tr>
<td>Product Name:</td>
<td><input type="text" id="name" th:field="*{name}"/></td>
<td class="error" th:errors="*{name}"></td>
</tr>
<tr>
<td>Brand:</td>
<td><input type="text" th:field="*{brand}"/></td>
<td class="error" th:errors="*{brand}"></td>
</tr>
<tr>
<td>Made In:</td>
<td><input type="text" th:field="*{madein}"/></td>
<td class="error" th:errors="*{madein}"></td>
</tr>
<tr>
<td>Price:</td>
<td><input type="text" th:field="*{price}" th:placeholder="price"/></td>
<td class="error" th:errors="*{price}"></td>
</tr>
<tr>
<td colspan="2">
<button type="submit">Save</button>
</td>
</tr>
</table>
</form>
Here last field price having the issue.
click here for the image
You should use a capital F Float for your property rather than a float. It has 2 states:
A null default won't display anything in the form fields.
After the form has been submitted, the field will have the correct value (and will display as a number).

Thymeleaf binding a selected value from a table

I'm having a table with multiple elements that are generated from a List and every table element from that list has a button.By clicking that button there is a post submit request which should bind the values from that table data element to a #ModelAttribute object in spring boot.
The problem is that i'm able to map the whole list but I want to bind only the table element where the button was pressed.
<div class="table-responsive">
<form th:action="#{/saveAd}" th:object="${object}" method="POST">
<table class="table table-sm table-hover">
<thead class="thead-dark">
<tr>
<th>Image</th>
<th>Title</th>
<!-- <th style="width: 16.66%">Link</th> -->
<th>Price</th>
<th>City</th>
</tr>
</thead>
<tbody id="myTable">
<th:block th:each="element, itemStat: *{lista}">
<tr
th:onclick="'javascript:rowClicked(\'' + *{lista[__${itemStat.index}__].url} + '\');'">
<input type="hidden" readonly="readonly"
th:name="?"
th:value="${element.getUrl()}" />
<td>
<input type="hidden" readonly="readonly" th:name="img" th:value="${element.getImg()}" />
<img th:src="*{lista[__${itemStat.index}__].img}" class="size" name="img" />
</td>
<td>
<input type="hidden" readonly="readonly" th:name="?" th:value="${element.getTitle()}" />
<span th:text="*{lista[__${itemStat.index}__].title}"></span>
</td>
<td>
<input type="hidden" readonly="readonly" th:name="?" th:value="${element.getPrice()}" />
<span th:text="*{lista[__${itemStat.index}__].price}"></span>
</td>
<td>
<input type="hidden" readonly="readonly" th:name="?" th:value="${element.getCity()}" />
<span th:text="*{lista[__${itemStat.index}__].city}"></span>
</td>
<td><input class="btn btn-danger" type="submit"
value="Save"></td>
</tr>
</th:block>
</tbody>
</table>
</form>
</div>
The Controller:
#RequestMapping(path = "/saveAd", method = RequestMethod.POST)
public String saveAd(#ModelAttribute("Value") ListCreationAutovitDto listCreationAutovitDto) {
return "home";
}
I have a hidden input type for every td which should map the values but i've tried naming it in different ways but i can't make it work.Are there any ways to bind only the values where the button was pressed?
Idea 1: Make each td contain a form pointing to your controller method. Then bind the values you want to pass to the model by using hidden input fields in the form. Each button would then do a submit for the form it is in.
Idea 2: If you're mapping json to your java objects in your app, you can construct the json request body in JavaScript to contain only the stuff you want for that request

Can parsley.js work with knockout.js?

I just learned about parsley.js and I'm trying to add it's validation capabilities to my project that is already wired up with knockout.js bindings. Here is the markup:
<form id="form-add-gift" data-bind="submit: addGift" data-validate="parsley">
<table class="table table-striped">
<thead>
<tr>
<th>Gift</th><th>Description</th><th>Url</th><th></th>
</tr>
</thead>
<tfoot>
<tr>
<td><input id="txtName" name="txtName" type="text" data-required="true" data-bind="value: newGift().name" /></td>
<td><input id="txtDescription" name="txtDescription" type="text" data-bind="value: newGift().description" /></td>
<td><input id="txtUrl" name="txtUrl" type="text" data-type="url" data-bind="value: newGift().url" /></td>
<td><button id="btnAdd" name="btnAdd" class="btn" type="submit" data-bind="disable: newGift().name.length > 0">Add gift</button></td>
</tr>
</tfoot>
<tbody data-bind="foreach: gifts">
<tr>
<td id="tdName" data-bind="text: name"></td>
<td id="tdDescription" data-bind="text: description"></td>
<td id="tdUrl" data-bind="text: url"></td>
<td><a id="btnRemove" class="btn btn-danger" href="#" data-bind="disabled: $parent.isClaimed, click: $parent.removeGift">Remove</a></td>
</tr>
</tbody>
</table>
</form>
When I click the "Add gift" button, my knockout.js addGift() function fires and the parsley.js validation occurs afterward. Obviously this is incorrect. Is there any way to get parsley.js to play nice with the knockout.js bindings?
I don't think parsley.js meant to work directly with KnockoutJs, but this can't stop you from using them both nicely.
Quick look through the Documentation -> Javascript - > Form you can use this method:
$('#form').parsley('isValid');
Useful if you want to integrate the form validation process inside
custom functions, without triggering error messages.
UPDATE
you can try this too:
$( '#form' ).parsley( 'validate' );
Useful if you want to integrate the form validation process inside
custom functions.

How to populate entity object values on Spring Form using jquery/ajax?

I have the Spring form
<form:form method="POST" action="/HelloWeb/addStudent" id="myForm">
<table>
<tr>
<td><form:label path="name">Name</form:label></td>
<td><form:input path="name" /></td>
</tr>
<tr>
<td><form:label path="age">Age</form:label></td>
<td><form:input path="age" /></td>
</tr>
<tr>
<td><form:label path="id">id</form:label></td>
<td><form:input path="id" /></td>
</tr>
<tr>
<td colspan="2">
<input type="submit" value="Submit"/>
</td>
</tr>
</table>
</form:form>
i can submit this form to controller using
$.post('{controller path}', $('#myForm').serialize());
now i want to populate entity object using jquery/Ajax on the this form and object will be returned from controller.
kindly guide me?
here is controller that call new page and populate object data on form...
#RequestMapping(value = "/addStudent", method = RequestMethod.POST)
public ModelAndView addStudent(#ModelAttribute("SpringWeb")Student student, ModelMap model)
{
Student stud =new Student();
//here will be my code to use student object....
return new ModelAndView("ViewStudent", "SpringWeb",stud);
}
but this method load new page ...instead of calling new i want do this logic on same page
The form: tags are interpreted on the server side, and generate regular HTML tags on the client side. Since jQuery is only running on the client side, it won't be able to find things using the form: tags. Try running the page and viewing the HTML source, then base your jQuery selectors on what you see there.

Spring MVC Table selected row

in a Spring MVC 2.5 application i'm using a spring <form:form> component and in this form a table with c:forEach is rendered.
In each row a submit button is placed in. If i start a submit by clicking a button i would like to knwo, which button has processed the submit.
<form:form commandName="formObject">
<table class="data-table" cellpadding="1" cellspacing="1" border="0">
<thead>
<tr>
</tr>
</thead>
<c:forEach items="${list}" var="document" varStatus="row">
<tr>
<td>
<input type="submit" value="${document.title}"/>
<td>
</tr>
</c:forEach>
</table>
</form:form>
THX.
Give the submit button a name. You can handle the request parameter from that button like any other parameter. Some browser might handle the value they give differently though.
<input name="submittype" type="submit" value="${document.title}" />

Resources