I had a requirement where using Spring MVC we had to take inputs multiple rows of data from user. The form had many rows which user can edit and submit My code look like this.When I tried to display the area list it is null What will be the reason
My view is
<form data-th-action="#{/qprmonitorlottery}" method="POST" >
<section>
<div class="panel panel-default" style="margin-top: 15px;">
<!-- Default panel contents -->
<div class="panel-heading">エリア間補完の有無</div>
<div class="panel-body">
<div class="table-responsive">
<table class="table table-bordered">
<tr>
<th width="13%" style="background: #FFFFFF; border-top: 1px solid #ffffff; border-left: 1px solid #ffffff;" > </th>
<th colspan="3" style="text-align: center">都市規模</th>
</tr>
<tr>
<th>エリア </th>
<th width="28%">大都市 </th>
<th width="29%">中都市</th>
<th width="30%">郊外 </th>
</tr>
<tr data-th-each="qprLottery,stat : ${qprLottery}">
<td data-th-text = "${qprLottery.areaName}">北海道 </td>
<td> <span style="display: inline-block; width: 80%">
<input type="number" data-th-value = "${qprLottery.rate1}" class="form-control" data-th-name="firstRate +${stat.index}" required >
<span class="help-block with-errors"></span>
</span> <span style="position: relative; top:-10px;" >%</span> </td>
<td> <span style="display: inline-block; width: 80%">
<input type="number" data-th-value = "${qprLottery.rate2}" class="form-control" data-th-name="secondRate +${stat.index}" required >
</span> <span style="position: relative; top:-10px;" >%</span> </td>
<td> <span style="display: inline-block; width: 80%">
<input type="number" data-th-value = "${qprLottery.rate3}" class="form-control" data-th-name="thirdRate +${stat.index}" required >
</span> <span style="position: relative; top:-10px;" >%</span> </td>
</tr>
</table>
</div>
</div>
</div>
</section>
<div class="row">
<div align="center" style="padding: 30 0px;">
<button type="submit" class="btn btn-primary" value="実行">実行
</button>
</div>
</div>
</form>
Controller is
#RequestMapping(value = "/qprmonitorlottery", method = RequestMethod.POST)
public String setQprMonitorLottery(#Valid #ModelAttribute() MasterCitySizeAreaForm form, BindingResult result) {
CitySizeByAreaView a = new CitySizeByAreaView();
System.out.println("Area list" + a.getRate1());
System.out.println("Area list-------------" + form.getAreaList());
if (result.hasErrors()) {
return "new-monitor-lottery";
}
return "new-monitor-lottery";
}
form classes are
public class MasterCitySizeAreaForm {
private ArrayList<CitySizeAreaForm> areaList;
public ArrayList<CitySizeAreaForm> getAreaList() {
return areaList;
}
public void setAreaList(ArrayList<CitySizeAreaForm> areaList) {
this.areaList = areaList;
}
}
form class 2
public class CitySizeAreaForm {
private int areaId;
private Integer area;
private Integer citySize;
private String areaName;
private String citySizeName;
private Float rate1;
private Float rate2;
private Float rate3;
public CitySizeAreaForm() {
}
public CitySizeAreaForm(Integer area, String areaName, Float rate1, Float rate2, Float rate3) {
this.area = area;
this.areaName = areaName;
this.rate1 = rate1;
this.rate2 = rate2;
this.rate3 = rate3;
}
}
replace:
<tr data-th-each="qprLottery,stat : ${qprLottery}">
with
<tr data-th-each="qprLottery,stat : ${qprLottery.areaList}">
This link helped me!!!Do try it!!
http://jsltech.blogspot.com/2013/12/how-add-multiple-objects-into-database.html
can use this format for displaying:-
<c:forEach items="${contactForm.contacts}" var="contact" varStatus="status">
<tr>
<td>${contact.firstname}</td>
<td>${contact.lastname}</td>
<td>${contact.email}</td>
<td>${contact.phone}</td>
</tr>
</c:forEach>
Related
Using itext and xmlworker version 5.5.13.2
I have a need to convert static HTML with basic CSS into a pdf. But the resulting PDF has not right format/ spacing/ position. Can someone help me out by pointing the mistake i have done or the something i have missed in the code part.
HTML
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div style="margin:5px; width:100%">
<div style="border:1px solid black;padding: 25px;">
<div class="row1">
<div class="floatR" style="min-width: 33%;width: 33%;min-height: 1px; float: right;">
<h3>
Tax Invoice/Bill Of Supply/ Cash Memo
</h3>
(Original for Recipient)
</div>
</div>
<div class="row1 marginT50p">
<div style="min-width: 33%;width: 33%;min-height: 1px;float: left;">
<h4>
Sold By:
ArtisanIndia Shoppping Private Limited,
</h4>
Shop On Plot No. 7 and 8, 41 and 42, Vijay Nagar,
Patrakar Colony Road, Mansarovar,
Jaipur - 302020, Rajasthan
State/UT Code: 08
Country: India
</div>
<div style="min-width: 33%;width: 33%;min-height: 1px;float: left;"></div>
<div style="min-width: 33%;width: 33%;min-height: 1px ;float: left;">
<h4>
Sold By:
ArtisanIndia Shoppping Private Limited,
</h4>
Shop On Plot No. 7 and 8, 41 and 42, Vijay Nagar,
Patrakar Colony Road, Mansarovar,
Jaipur - 302020, Rajasthan
State/UT Code: 08
Country: India
</div>
</div>
<div class="row1 marginT25">
<div style="min-width: 33%;width: 33%;min-height: 1px;float: left;">
<label class="textUnderline">Comapny GSTIN:</label>JKDHFBGKJDJHJ
<br />
<label class="textUnderline">Comapny PAN:</label>SDJKHFGB
</div>
<div style="min-width: 33%;width: 33%;min-height: 1px;float: left;"></div>
<div style="min-width: 33%;width: 33%;min-height: 1px;float: left;">
<label class="textUnderline">Biller GSTIN:</label>JKDHFBGKJDJHJ
<br />
<label class="textUnderline">Biller PAN:</label>SDJKHFGB
</div>
</div>
<div class="row1 marginT25">
<div style="min-width: 33%;width: 33%;min-height: 1px;float: left;">
<label class="textBold">Order ID:</label>235235
<br />
<label class="textBold">Order Date:</label>12/12/1912
</div>
<div style="min-width: 33%;width: 33%;min-height: 1px;float: left;"></div>
<div style="min-width: 33%;width: 33%;min-height: 1px;float: left;">
<label class="textBold">Shipping Address:</label>
<br />
<label class="textBold"> </label>
<br />
Shop On Plot No. 7 and 8, 41 and 42, Vijay Nagar,
Patrakar Colony Road, Mansarovar,
Jaipur - 302020, Rajasthan
State/UT Code: 08
Country: India
</div>
</div>
<div class="row1 marginT25">
<div style="min-width: 33%;width: 33%;min-height: 1px;float: left;">
<label class="textBold">Invoice Date:</label>12/12/1912
<br />
<label class="textBold">Order ID:</label>AI/2012/907656767
</div>
<div style="min-width: 33%;width: 33%;min-height: 1px;float: left;"></div>
<div style="min-width: 33%;width: 33%;min-height: 1px;float: left;">
<label class="textBold">Place Of Supply:</label> Maharastra
<br />
<label class="textBold">Place Of Delivery:</label>Maharastra
</div>
</div>
<div class="row1 marginT25">
<table style="width:100%">
<tr>
<th>Sr. No.</th>
<th>Product</th>
<th>Description</th>
<th>HSN</th>
<th>GST %</th>
<th>QTY</th>
<th>Gross Amount</th>
<th>Discount</th>
<th>Taxable value</th>
<th>CGST</th>
<th>SGST</th>
<th>IGST</th>
<th>Total</th>
</tr>
<tr>
<td>1</td>
<td>Product Description</td>
<td>Item Description</td>
<td>123456</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td>2</td>
<td>Product Description</td>
<td>Item Description</td>
<td>123456</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td>3</td>
<td>Product Description</td>
<td>Item Description</td>
<td>123456</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td colspan="5">Total</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</table>
</div>
<div class="row1">
<div style="min-width: 25%; width: 25%; min-height: 1px;float: left;">
<label class="textUnderline textBold">
Seller Registered Address:
ArtisanIndia Shoppping Private Limited,
</label>
Shop On Plot No. 7 and 8, 41 and 42, Vijay Nagar,
Patrakar Colony Road, Mansarovar,
Jaipur - 302020, Rajasthan
State/UT Code: 08
Country: India
</div>
</div>
<div class="row1 marginT50p">
<div style="min-width: 25%; width: 25%; min-height: 1px;float: left;">
E. & O. E.
</div>
<div class=" floatR" style="min-width: 25%; width: 25%; min-height: 1px; float: right;">
<div class="signbox">
Sign/Stamp
</div>
<span> Ordered Through
</span>
<span class="textUnderline">
ArtisanIndia Shoppping Pvt Limited
<br />
Authorized Signature
</span>
</div>
</div>
</div>
</div>
</body>
</html>
CSS
* {
font-family: sans-serif;
font-size:8px
}
.width33 {
min-width: 33%;
width: 33%;
min-height: 1px;
border:1px solid red
}
.width25 {
min-width: 25%;
width: 25%;
min-height: 1px;
border: 1px solid green;
}
.row1:after {
content: "";
display: table;
clear: both;
}
.floatL {
float: left;
}
.floatR {
float: right;
}
.marginT25 {
margin-top: 25px;
}
.marginT50p {
margin-top: 50px
}
.textUnderline {
text-decoration: underline;
}
.textBold {
font-weight: bold;
}
table,
th,
td {
border: 1px solid black;
border-collapse: collapse;
font-size: 10px;
}
th,
td {
height: 40px;
text-align: center;
}
.signbox {
vertical-align: middle;
text-align: center;
height: 50px;
border: 1px solid black;
/* margin: auto; */
}
Java
UploadUtil s3Upload = new UploadUtil();
PdfWriter pdfWriter = null;
ByteArrayOutputStream gg = new ByteArrayOutputStream();
try{
Document document = new Document();
PdfWriter.getInstance(document, gg);
document.open();
XMLWorkerHelper xmlWorkerHelper = XMLWorkerHelper.getInstance();
xmlWorkerHelper.parseXHtml(pdfWriter, document, new FileInputStream("C:\\Users\\jj\\Desktop\\asdf\\tt.html"), new FileInputStream("C:\\Users\\jj\\Desktop\\asdf\\ttt.css"));
document.close();
FileOutputStream fos = new FileOutputStream("C:\\Users\\jj\\Desktop\\asdf\\test.pdf");
fos.write(gg.toByteArray());
fos.close();
}
catch(Exception e){
System.out.println("asdf");
}
the resulting pdf generated looks something like this.
instead of
Can someone out here point out the reason why this is happening or what I have missed or done wrong?
iText 5.5.13.2 is the old version of iText product and it's not supported anymore. Most likely there are some not supported functionality in the html or css. I can guess that float properties are not supported. Probably there are issues with percentage width. You can try to play around with your html and css files to try to make pdf look acceptable, but the easiest way is to use the newest version of iText product which is iText 7
I am new to Java and I'm currently working on a project with springboot and thymeleaf template engineer. I am having issues making an HTTP POST request with nested Set Collection.
My Java Classes are
User Class
import java.util.Set;
public class User {
private String name;
private String school;
private String bestSubject;
private Set<Work> work;
*//constructors, getters and setters*
}
Work Class
public class Work {
private String companyName;
private String faxNumber;
private String location;
*//constructors, getters and setters*
}
Controller
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.ModelAttribute;
import org.springframework.web.bind.annotation.PostMapping;
#Controller
public class UserController {
#Autowired
private UserService userService;
#GetMapping(value = "/user-register")
public String showUser(Model model) {
User users = new User();
model.addAttribute("users", userService.getUsersList());
return "userPage";
}
#PostMapping(value = "/user-details")
public String createUser(#ModelAttribute("users") User user){
System.out.println(user);
return "userResult";
}
}
Views
userPage.html
<form action="#" th:action="#{/user-details}" method="post" th:object="${users}">
<div class="row">
<div class="col-4">
<label for="name" class="col-form-label">Full Name:</label>
<input type="text" id="name" th:field="*{name}" class="form-control">
</div>
<div class="col-4">
<label for="school" class="col-form-label">School:</label>
<input type="text" id="school" th:field="*{school}" class="form-control">
</div>
<div class="col-4">
<label for="bestSubject" class="col-form-label">Best Subject:</label>
<input type="text" id="bestSubject" th:field="*{bestSubject}" class="form-control">
</div>
</div>
<!--BUTTON TO ADD AND DELETE FIELDS-->
<div class="row mt-4 mb-1">
<div class="col d-flex justify-content-between">
<div onclick="createField()" class="btn btn-primary float-start">Create row</div>
<div onclick="deleteField()" class="btn btn-danger float-end">Delete row</div>
</div>
</div>
<!--FIELDS LABEL-->
<div class="row">
<div class="col-4">
<label for="companyName" class="col-form-label">Company Name:</label>
</div>
<div class="col-4">
<label for="faxNumber" class="col-form-label">Fax Number:</label>
</div>
<div class="col-4">
<label for="location" class="col-form-label">Location:</label>
</div>
</div>
<table class="table table-borderless mt-0" id="userTable">
<tbody id="tableBody">
<tr th:each="user : ${users.work}">
<td>
<input type="text" id="companyName" th:field="*{user.companyName}" class="form-control">
</td>
<td>
<input type="text" id="faxNumber" th:field="*{user.faxNumber}" class="form-control">
</td>
<td>
<input type="text" id="location" th:field="*{user.location}" class="form-control">
</td>
</tr>
</tbody>
</table>
<button type="submit" class="btn btn-warning">
SUBMIT
</button>
</form>
UserResult.html
<p>Full Name: <span th:text="${users.name}"></span></p>
<p>University: <span th:text="${users.school}"></span></p>
<p>Best Subject: <span th:text="${users.bestSubject}"></span></p>
<table class="table table-striped .table-hover mt-1">
<thead>
<tr>
<th scope="col">Company Name</th>
<th scope="col">Fax Number</th>
<th scope="col">Address</th>
</tr>
</thead>
<tbody>
<tr th:each="user : ${users.work}">
<td th:text="${user.companyName}">
</td>
<td th:text="${user.faxNumber}">
</td>
<td th:text="${user.location}">
</td>
</tr>
</tbody>
</table>
My QUESTION IS
I keep getting User{name='...', school='...', bestSubject='...', work { **'null**' }}
Instead of
{
name: '...'
school: '...'
work: {
company_name: '...',
fax_number: '...',
location: '...'
}
}
How do I ensure my Set collection returns the inputed data from the fields instead of null datatype?
I use an angular+springboot web application in which an object ( for this example- clinic object ) fetched from springboot in angular is not modified, and then is sent back to springboot, and some of its prperties's values for no apparent reason just become null, and others ( a boolean property get value of false, and integer properties get value of 0 ) get default values.
This is a table in which clinic objects are desplayed, and from which a modal to update a clinic is opened.
<table class="table">
<thead>
<tr>
<th scope="col" style="text-align:right;"></th>
<th scope="col" style="text-align:right;">State</th>
<th scope="col" style="text-align:right;">Foundation Year</th>
<th scope="col" style="text-align:right;">Supervisor</th>
<th scope="col" style="text-align:right;">Clinic Name</th>
</tr>
</thead>
<tbody>
<tr [ngClass]="{'not-active-clinic':!clinic.active}" *ngFor="let clinic of clinics">
<td style="text-align:right;">
<button class="btn-primary mr-1" (click)="openEditModal(editModal,clinic)"><i
class="fa fa-edit"></i></button>
<!--Edit Modal -->
<ng-template #editModal let-modal>
<div class="modal-header">
<h4 class="modal-title" id="modal-basic-title">Clinic Edit</h4>
<button style="margin-left: 0;" type="button" class="close" aria-label="Close"
(click)="modal.dismiss('Cross click')">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form dir="rtl">
<div class="row">
<div class="col-3">
<label>
Clinic Name: </label>
</div>
<div class="col-9">
<input style="width: 100%;" type="text" name="clinicName"
[(ngModel)]="edittedClinic.clinicName">
</div>
</div>
<div class="row">
<div class="col-3">
<label>
Supervisor</label>
</div>
<div class="col-9">
<select (change)="onChange()" style="width: 100%;"
name="clinicalSupervisorId"
[(ngModel)]="edittedClinic.clinicalSupervisorId">
<option *ngFor="let s of supervisors" [value]="s.id">
{{s.firstName+' '+s.lastName}}
</option>
</select>
</div>
</div>
<div class="row">
<div class="col-3">
<label>
description:</label>
</div>
<div class="col-9">
<textarea style="width: 100%;height:350px"
[(ngModel)]="edittedClinic.description" name="description">
</textarea>
</div>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-outline-dark"
(click)="modal.close('Save click');onEdit(clinic)">Edit</button>
</div>
</ng-template>
<button class="btn btn-sm btn-danger btn-delete-account"
(click)="openDeleteModal(deleteModal)">
<span class="spinner-border spinner-border-sm"><i
class="fa fa-trash-alt"></i></span>
</button>
<!--Delete Modal -->
</td>
<td style="text-align:right;">
<button (click)="onChangeClinicState(clinic)">
{{clinic.active?"Add To Archive":"Restore"}}</button>
</td>
<td style="text-align:right;">{{clinic.yearFounded}}</td>
<td style="text-align:right;">{{clinic.clinicalSupervisorId}}</td>
<td style="text-align:right;">{{clinic.clinicName}}</td>
</tr>
</tbody>
</table>
This the method in angular to fetch the edited object to send it to service in which there is the http call to send the clinic object to springboot:
onEdit(clinicToEdit:Clinic)
{
this.dashboardService.updateClinicDetails(this.edittedClinic).subscribe(
data=>{
clinicToEdit=Object.create(this.edittedClinic);
},
err=>{
}
)
}
This is the method in the service to send the http put call
updateClinicDetails(clinic:Clinic)
{
return this.http.put(BASE_URL +`/api/v1/clinic/${clinic.clinicName}`,clinic);
}
This is the API method in springboot to get the clinic object sent from angular.
#PutMapping(path = "{clinicName}")
public int updateClinicById(#PathVariable("clinicName") String clinicName, #RequestBody Clinic clinicToUpdate)
{
return clinicService.updateClinic(clinicName, clinicToUpdate);
}
This is the constructor of clinic object invoked in order to fetch the JSON sent to springboot from angular.
public Clinic(#JsonProperty("clinicName") String clinicName,
#JsonProperty("clinicalSupervisorId") int clinicalSupervisorId,
#JsonProperty("description") String description, #JsonProperty("yearFounded") int yearFounded,
#JsonProperty("active") boolean active)
{
this.clinicName = clinicName;
this.clinicalSupervisorId = clinicalSupervisorId;
this.yearFounded = yearFounded;
this.description = description;
this.active = active;
}
Now, the thing is when modified, those mentioned properties don't contain null values, or their default values, What is the explanation to this, and what's the best way to solve it?
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="https://www.thymeleaf.org">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" type="text/css" media="all" th:href="#{/css/bootstrap.min.css}">
<title>Home</title>
</head>
<body class="p-3 mb-2 bg-light text-black">
<div class="container">
<div id="logoutDiv">
<h1 th:text="${'Welcome ' + name}">Name</h1>
<form action="#" th:action="#{/logout}"method="POST">
<button type="submit" class="btn btn-secondary float-right">Logout</button>
</form>
</div>
<div id="contentDiv" style="clear: right;">
<nav style="clear: right;">
<div class="nav nav-tabs" id="nav-tab" role="tablist">
<a class="nav-item nav-link active" id="nav-files-tab" data-toggle="tab" href="#nav-files" role="tab" aria-controls="nav-files" aria-selected="true">Files</a>
<a class="nav-item nav-link" id="nav-notes-tab" data-toggle="tab" href="#nav-notes" role="tab" aria-controls="nav-notes" aria-selected="false">Notes</a>
<a class="nav-item nav-link" id="nav-credentials-tab" data-toggle="tab" href="#nav-credentials" role="tab" aria-controls="nav-credentials" aria-selected="false">Credentials</a>
</div>
</nav>Upload<
<div class="tab-content" id="nav-tabContent">
<div class="tab-pane fade show active" id="nav-files" role="tabpanel" aria-labelledby="nav-files-tab">
<p th:text="${message}" th:if="${message ne null}" class="alert alert-primary"></p>
<form action="#" enctype="multipart/form-data" th:action="#{'/file/uploadFile'}" th:method="POST" >
<div class="container">
<div class="row" style="margin: 1em;">
<div class="col-sm-2">
<label for="fileUpload">Upload a New File:</label>
</div>
<div class="col-sm-6">
<input type="file" class="form-control-file" id="fileUpload" name="fileUpload">
</div>
<div class="col-sm-4">
<button type="submit" class="btn btn-dark">/button>
</div>
</div>
</div>
</form>
<div class="table-responsive">
<table class="table table-striped" id="fileTable">
<thead>
<tr>
<th style="width: 20%" scope="col"></th>
<th style="width: 80%" scope="col">File Name</th>
</tr>
</thead>
<tbody>
<tr th:each="file : ${files}">
<td>
<a target="_blank" class="btn btn-success" th:href="#{/file/{filename}(fileName = ${file.filename})}">View</a>
<a class="btn btn-danger" th:href="#{/file/delete{filename}(filename = ${file.filename})}" >Delete</a>
</td>
<th scope="row" th:text="${file.filename}" ></th>
</tr>
</tbody>
</table>
</div>
</div>
<div class="tab-pane fade" id="nav-notes" role="tabpanel" aria-labelledby="nav-notes-tab">
<button style="margin: 0.25em;" type="button" class="btn btn-info float-right" onclick="showNoteModal()">
+ Add a New Note
</button>
<div class="table-responsive">
<table class="table table-striped" id="userTable">
<thead>
<tr>
<th style="width: 20%" scope="col"></th>
<th style="width: 20%" scope="col">Title</th>
<th style="width: 60%" scope="col">Description</th>
</tr>
</thead>
<tbody>
<tr th:each="note : ${notes}">
<td>
<button id="edit-note" type="button" class="btn btn-success"
th:attr="data-id=${note.getNoteId},
data-title=${note.getNoteTitle},
data-description=${note.getNoteDescription}"
onclick="showNoteModal (this.getAttribute('data-id'),this.getAttribute('data-title'),this.getAttribute('data-description'))">Edit/View</button>
<a id="delete-note" class="btn btn-danger" th:href="#{/note/delete/{noteId}(noteId = ${note.getNoteId()})}">Delete</a>
</td>
<th id="notetitle" scope="row" th:text="${note.getNoteTitle()}">Example Title</th>
<td id="notedescription" th:text="${note.getNoteDescription()}">Example Description </td>
</tr>
</tbody>
</table>
</div>
<div class="modal fade" id="noteModal" tabindex="-1" role="dialog" aria-labelledby="noteModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="noteModalLabel">Note</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
-Here is the error that I get-
<form action="#" method="POST" th:action="#{/note/add}" th:object="${Notes}">
<input type="hidden" name="noteId" id="note-id">
<div class="form-group">
<label for="note-title" class="col-form-label">Title</label>
<input type="text" name= "noteTitle" class="form-control" id="note-title" maxlength="20" required th:field="*{noteTitle}">
</div>
<div class="form-group">
<label for="note-description" class="col-form-label">Description</label>
<textarea class="form-control" name="noteDescription" id="note-description" rows="5" maxlength="1000" required th:field="*{noteDescription}"></textarea>
</div>
<button id="noteSubmit" type="submit" class="d-none"></button>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary" onclick="$('#noteSubmit').click();">Save changes</button>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="nav-credentials" role="tabpanel" aria-labelledby="nav-credentials-tab">
<button style="margin: 0.25em;" type="button" class="btn btn-info float-right" onclick="showCredentialModal()">
+ Add a New Credential
</button>
<div class="table-responsive">
<table class="table table-striped" th:object="${credentials}" id="credentialTable">
<thead>
<tr>
<th style="width: 20%" scope="col"></th>
<th style="width: 35%" scope="col">URL</th>
<th style="width: 20%" scope="col">Username</th>
<th style="width: 25%" scope="col">Password</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<button type="button" class="btn btn-success">Edit</button>
<a class="btn btn-danger">Delete</a>
</td>
<th scope="row">Example Credential URL</th>
<td>Example Credential Username</td>
<td>Example Credential Password</td>
</tr>
</tbody>
</table>
</div>
<div class="modal fade" id="credentialModal" tabindex="-1" role="dialog" aria-labelledby="credentialModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="credentialModalLabel">Credential</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form action="#" method="POST">
<input type="hidden" name="credentialId" id="credential-id">
<div class="form-group">
<label for="note-title" class="col-form-label">URL</label>
<input type="text" name= "url" class="form-control" id="credential-url" maxlength="100" required>
</div>
<div class="form-group">
<label for="note-title" class="col-form-label">Username</label>
<input type="text" name= "username" class="form-control" id="credential-username" maxlength="30" required>
</div>
<div class="form-group">
<label for="note-title" class="col-form-label">Password</label>
<input type="text" name= "password" class="form-control" id="credential-password" maxlength="30" required>
</div>
<button id="credentialSubmit" type="submit" class="d-none"></button>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary" onclick="$('#credentialSubmit').click();">Save changes</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script th:src="#{/js/jquery-slim.min.js}"></script>
<script th:src="#{/js/popper.min.js}"></script>
<script th:src="#{/js/bootstrap.min.js}"></script>
<!--For opening the note modal-->
<script type="text/javascript">
// For opening the note modal
function showNoteModal(noteId, noteTitle, noteDescription) {
$('#note-id').val(noteId ? noteId : '');
$('#note-title').val(noteTitle ? noteTitle : '');
$('#note-description').val(noteDescription ? noteDescription : '');
$('#noteModal').modal('show');
}
// For opening the credentials modal
function showCredentialModal(credentialId, url, username, password) {
$('#credential-id').val(credentialId ? credentialId : '');
$('#credential-url').val(url ? url : '');
$('#credential-username').val(username ? username : '');
$('#credential-password').val(password ? password : '');
$('#credentialModal').modal('show');
}
</script>
</body>
</html>
-I get an error when trying to parse the Note Form into my Note Controller. I try to parse my model object Notes in the form in my HTML home form into the Controller but it can not except the fields from the form. My first error is this:
Caused by: org.thymeleaf.exceptions.TemplateProcessingException: Error during execution of processor 'org.thymeleaf.spring5.processor.SpringInputGeneralFieldTagProcessor' (template: "home" - line 109, col 148), Line 109 is the fields from the form
I also get a second error: java.lang.IllegalStateException: Neither BindingResult nor plain target object for bean name 'Notes' available as request attribute-
--- Note Controller ---
#Controller
#RequestMapping("note")
public class NoteController {
private NoteService noteServices;
private UserService userService;
public NoteController(NoteService noteServices, UserService userService) {
this.noteServices = noteServices;
this.userService = userService;
}
// Add an new note
#PostMapping("add")
public String addNote(#ModelAttribute(value="Notes")Notes Notes, Authentication authentication, Model model) throws IOException {
String userName = authentication.getName();
User user = userService.getUser(userName);
Integer userid = user.getId();
if(Notes.getNoteId() == null){
noteServices.addNote(Notes,userid);
}else{
noteServices.editNote(Notes);
}
return "result";
}
#GetMapping("/delete/{noteId:.+}")
public String deleteNote(#PathVariable Integer noteId, Authentication authentication, RedirectAttributes redirectAttributes){
noteServices.deleteNote(noteId);
redirectAttributes.addFlashAttribute("deleteNoteSuccess","Note deleted successfully.");
return "redirect:/result";
}
private Integer getUserId(Authentication authentication) {
String userName = authentication.getName();
User user = userService.getUser(userName);
return user.getId();
}
}
---
--- POJO Model ---
public class Notes {
private Integer noteId;
private String noteTitle;
private String noteDescription;
private Integer userId;
public Notes(String noteTitle, String noteDescription, Integer userId) {
this.noteTitle = noteTitle;
this.noteDescription = noteDescription;
this.userId = userId;
}
public Integer getNoteId() {
return noteId;
}
public void setNoteId(Integer noteId) {
this.noteId = noteId;
}
public String getNoteTitle() {
return noteTitle;
}
public void setNoteTitle(String noteTitle) {
this.noteTitle = noteTitle;
}
public String getNoteDescription() {
return noteDescription;
}
public void setNoteDescription(String noteDescription) {
this.noteDescription = noteDescription;
}
public Integer getUserId() {
return userId;
}
public void setUserId(Integer userId) {
this.userId = userId;
}
}
Need some advice how should I retrieve a list of exhibits.
In my html template below, I only put one record of exhibit. If i were to put additional rows/records of exhibit, how do i go about mapping them to the controller.
HTML Template
<h3>Exhibit Details</h3>
<div class="table-responsive">
<table id="exhibitTable"
class="table table-bordered table-hover table-striped">
<thead>
<tr>
<th>Exhibit Type</th>
<th>Description</th>
<th>Marking</th>
<th>Remarks</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<div class="form-group col-md-3">
<div class="cols-sm-10">
<select class="form-control selectpicker cols-md-3"
th:value="${exhibit.exhibitType}" id="exhibitType"
name="exhibitType" roleId="exhibitType">
<option value="">Select Type</option>
<option>Desktop</option>
<option>Laptop</option>
<option>Mobile Device</option>
<option>Portable Storage</option>
<option>Server</option>
<option>Video System</option>
<option>Save As</option>
<option>Others</option>
</select>
</div>
</div>
</td>
<td>
<div class="form-group col-md-3">
<input type="text" name="exhibitDescription"
id="exhibitDescription"
th:value="${exhibit.exhibitDescription}" />
</div>
</td>
<td>
<div class="form-group col-md-3">
<input type="text" name="exhibitMarking" id="exhibitMarking"
th:value="${exhibit.exhibitMarking}" />
</div>
</td>
<td><div class="form-group col-md-3">
<input type="text" name="exhibitRemarks" id="exhibitRemarks"
th:value="${exhibit.exhibitRemarks}" />
</div></td>
</tr>
</tbody>
</table>
</div>
Controller
#RequestMapping(value = "/register", method = RequestMethod.POST)
public String registerIncidentPost(#ModelAttribute("incident") Incident incident,
#ModelAttribute("exhibit") Exhibit exhibit, Principal principal) throws Exception {
long year = Calendar.getInstance().get(Calendar.YEAR);
incident.setIncidentYear(year + "");
Long refNo = incidentService.findMaxRefNoCurrentYear(year + "");
if (refNo == null)
refNo = (long) 1;
else
refNo += 1;
incident.setIncidentRefNo(refNo);
incident.setIncidentStatus(Incident.INCIDENT_REGISTERED);
incident.setIncidentOpeningTimestamp(new Date());
User user = userService.findByUsername(principal.getName());
incident.setIncidentCreatedBy(user);
incidentService.createIncident(incident);
exhibitService.createExhibit(exhibit);
return "redirect:/incident";
}
I've attempted to add the following to my template
<tr data-th-each="exhibit:${exhibitList}">
and the following to my controller
#ModelAttribute("exhibitList") ArrayList<Exhibit> exhibitList
but did not work.
Thanks in advance.
I can only assume this is vb.net since you didn't specify. You need to pass in the complete dataset to the page. Each item in the dataset will be one pre-loaded instance of the model. Then you can do a for each loop on the page itself and generate the html dynamically. Hope this helps.