Thymeleaf - Error displaying list/collection fields - spring-boot

I am converting a document that is readonly into a one where a user can edit.
Looping the values into a text was possible, my problem is converting those text into fields.
Currently I have the following code in my HTML, whereby the defectDto is the object I am planning on using to capture the fields.
<tr th:each="res, stat : *{response}" th:object="${defectDto}">
<td>
<input type="number" th:field="*{res[__${stat.index}__].defectId}" readonly="true"/>
</td>
...
</tr>
The HTML code above results in a processing error, please see image below:
In Java, I've used the model to bind the list returned (as seen below):
model.addAttribute("response", getDefectMessage.getMessage());
getDefectMessage.getMessage() above is of type List of DefectDto. The sample data is as seen below (please see image).
Being a newbie in Thymeleaf, may I please get assistance in rendering the HTML page without any errors. (Thanks in advance).

Related

Thymeleaf URI template JSP equivalent

In JSP I used to have a table and a link to a record using this syntax:
<td>${person.id}</td>
So I could click the link on a table to move to a person's details page. I would like to achieve the same result using Thymeleaf, but not quite sure how. So my question is: what is Thymeleaf equivalent?
<td th:text="${trip.hrPerson}"></td>
<td><a th:href="#{/remove/trip.id}"></a> ${trip.id} </td>
First example displays static value and it's ok, second is supposed to be a link but it fails.
In Thymleaf you make link as follows
<a th:href="#{'/person/' + $person.id}" th:text="${person.id}">My User id</a>

Excel VBA to Deal With AJAX

I am practicing to use excel vba to download information from website: http://mops.twse.com.tw/mops/web/t05sr01_1
But I have no idea how to download the data behind click button, as the image shown: http://i.stack.imgur.com/KZHiZ.jpg
I excerpt its web code as below. Could anyone explain me how to code in excel vba to get its data?
Thank you very mush.
Web code:
<td style='text-align:left !important;' nowrap>鴻海</td>
<td style='text-align:left !important;'>105/01/05</td>
<td style='text-align:left !important;'>11:41:00</td>
<td style='text-align:left !important;'>說明媒體報導</td>
<td><input type='button' value='詳細資料' onclick="document.fm_t05sr01_1.SEQ_NO.value='1';document.fm_t05sr01_1.SPOKE_TIME.value='114100';document.fm_t05sr01_1.SPOKE_DATE.value='20160105';document.fm_t05sr01_1.COMPANY_NAME.value='?E??';document.fm_t05sr01_1.COMPANY_ID.value='2317';document.fm_t05sr01_1.skey.value='2317201601051';document.fm_t05sr01_1.hhc_co_name.value='?E??';ajax1(this.form,'table01');">
You haven't shown how you are getting the html.
You can use a CSS selector.
General for first input button
input[type=button]
This says element(s) with input tag having attribute type whole value is 'button'
You apply with the querySelector method, or querySelectorAll if more than one match and then use index for required element.
ie.document.querySelector("input[type=button]").Click
If in an HTMLDocument variable e.g. htmlDoc then
htmlDoc.querySelector("input[type=button]").Click

View component of MVC. Should I pre generate HTML tag elements in the Controller for the View?

I'am currently creating a MVC Java Web App with Struts2.
One element of my app is searching for some results via form. When the user submits the form an Action gets the necessary values from the database and populates a Map:
Map<Integer,List<String>> values = new HashMap<Integer,List<String>>();
Which has a list of column values for each row.
By Following this approach I can have generic JSP for displaying the results of any resultbox:
<s:div cssClass='resultContainer'
cssStyle=' min-height: 150px; max-height:%{header}px; overflow: auto; %{display}; '
theme="qxhtml">
<table id='resultTable'>
<tr id='tableHeader'>
<s:iterator value="headers">
<th><s:property /></th>
</s:iterator>
</tr>
<s:iterator value="values">
<tr class='results'>
<s:iterator value="value">
<td><s:property escape="false" /></td>
</s:iterator>
</tr>
</s:iterator>
</table>
I feel now that this is a bad approach. Instead I should change the Map to a List of ResultBoxRow objects. Each ResultBox will have its own View Jsp instead of one generic one allowing me to iterate over the objects and output for example:
<s:iterator value="value">
<td><s:property name="firstname" /></td>
<td><s:property name="lastname" /></td>
etc.
In the case of the table headers I may need to give certain headers individual style properties. I feel these should be defined in the JSP itself rather than get the JSP to reference a value from the controller containing the style for that header.
I think my overall question is how much should the controller control the style/display of elements of the View? I feel it should just generate the individual elements displayed in the tags but not the values to put in the "style" tag of the row for example. Even if this does sacrifice a simple single JSP to handle every result box.
It would be great to get your opinions.
The controller should have nothing to do with the display mechanism: that's the point of MVC, to completely separate the data from its presentation.
You can still DRY up the view layer via custom tags, includes, templates, etc. Styles may be passed as attributes, while the underlying DOM would be created by a single page or template.
It also matters what the nature of the attributes you want to pass. If they're semantic that could logically from from the model or controller that's fine. If they're purely presentational, like colors, widths, etc. then it has no business in the model or controller.

Only one page is generated with XSL-FO Page-Break Problem?

I am generating a PDF Document through XSL-FO. I have a simple xhtml structure like this:
<body>
<h2><center>Status</center></h2>
<table border="0">
<colgroup span="5"></colgroup>
<tr>
<td><h4>Aktion</h4></td>
<td><h4>Kommentar</h4></td>
<td><h4></h4></td>
<td><h4>Zeitpunkt</h4></td>
<td><h4>Benutzer</h4></td>
</tr>
<tr>
<td><h5>Mappe archiviert</h5></td>
<td><h5>QMSAA</h5></td>
<td><h5></h5></td>
<td><h5>26.07.2011 13:14</h5></td>
<td><h5>Mustermann, Peter</h5></td>
</tr>
<tr>
<td><h5>Mappe als pdf gedruckt.</h5></td>
<td><h5></h5></td>
<td><h5></h5></td>
<td><h5>26.07.2011 13:14</h5></td>
<td><h5>Mustermann, Peter</h5></td>
</tr>
....
And i am using a xhtml to fop Stylesheet to convert this xhtml to an xsl-fo table. This works for most cases and in this case here i also get one page of content, but this should be at least two pages. While generating i get the following warnings:
30.08.2011 09:57:36 org.apache.fop.apps.FopFactoryConfigurator configure
INFO: Default page-height set to: 11in
30.08.2011 09:57:36 org.apache.fop.apps.FopFactoryConfigurator configure
INFO: Default page-width set to: 8.26in
30.08.2011 09:57:36 org.apache.fop.fo.flow.TableColumn bind
WARNUNG: table-layout="fixed" and column-width unspecified => falling back to pr
oportional-column-width(1)
30.08.2011 09:57:37 org.apache.fop.layoutmgr.inline.ContentLayoutManager
WARNUNG: Title has no content
30.08.2011 09:57:37 org.apache.fop.layoutmgr.PageBreaker$1 notifyOverflow
WARNUNG: Content of the region-body on page 1 overflows the available area in bl
ock-progression dimension. (fo:page-sequence, no context info available)
The result i get is one page of content with one element overflowing the bottom of the page. But the rest of the content is lost, not second page is generated.
What could be the problem here?
Is it possible to have a pagebreak between two fo:table-row elements of one table?
Why is no second page generated?
There is a problem with the keep-with-next.within-column property on blocks within table cells in your FO document. If the "always" values are replaced with "auto", FOP 1.0 outputs four pages.
This could be a bug in FOP. I also processed the FO document with XEP, and it produced four pages without complaining.
Maybe what you really want is keep-together on table rows?
I also noticed an empty font-family attribute on <fo:page-sequence>.
Not really an answer to your question, but you could use the open source speedata Publisher which has automatic table breaking across pages. It is not an XSL-FO formatter but similar. Currently in German only (this will change in spring 2012) but I know that this is not a problem for you.

Firefox 3.5.2 Refresh(F5) causes Highlighted Form value to get copied to next field

I am having a strange issue in Firefox 3.5.2 with F5 refresh.
Basically, when I focus on an input field and hit f5 the contents of that input field gets copied to the next form field after the F5 refresh.
But, if you inspect the HTML source code, the values are correctly loaded.
I am not having this issue in IE8 or Safari 4.0.3.
The problem does not occur if I do a hard refresh or run window.location.refresh(true).
After F5 Refresh: http://i805.photobucket.com/albums/yy339/abepark/after.jpg
Here's an overview of what's going on.
I believe the thing you should look into is the autocomplete attribute,
you should set it to off on the input box. However be careful since this will trigger two effects.
When you refresh the page it won't remember the old values
The default dropdown of the already used values on that input box will also be disabled.
If you want to keep the second behavior you should set the autocomplete attribute back to on with JS.
Browsers can remember form field contents over a refresh. This can really throw your scripting off if it is relying on the initial value of a field matching what's in the HTML. You could try to prevent it by calling form.reset() at the start.
Different browsers have different strategies for detecting when a form or a field is the same as in the previous page. If you have clashing names, or names that change on reload, it is very possible to end up confusing them. Would have to see some code to work it out for sure.
In the backend, I am using ASP.NET MVC 1.0 with the Spark View engine. When I examine the source code after an F5 refresh in Firefox 3.5.2, the page renders correctly; however, if you look at the page visually the adjacent form field field gets populated with the value from the previous field.
I included enough code so you can just get an idea of what I'm trying to do.
Again, the rendering is fine and the final view/HTML code is fine. It's what I see on the screen that is incorrect. I am using hidden vars; but the issue occurred before using it as well.
Note in the code below, I have 2 distinct ID fields: "date_{projectTask.ProjectTaskId}" and "finishDate_{projectTask.ProjectTaskId}, which gets renders to something like "date_1" and "finishDate_2".
<table>
<for each="ProjectTask projectTask in projectTasksByProjectPhase">
<input type="hidden" value="${projectTask.ProjectTaskId}" />
<tr>
<td class="date">
<div class="box">
<div class="datefield">
<input type="text" id="date_${projectTask.ProjectTaskId}" value="${startDate}" /><button type="button" id="show_${projectTask.ProjectTaskId}" title="Show Calendar"><img src="~/Content/yui/assets/calbtn.gif" width="18" height="18" alt="Calendar" ></button>
</div>
</div>
</td>
<td>
<div class="box">
<div class="datefield">
<input type="text" id="finishDate_${projectTask.ProjectTaskId}" value="${finishDate}" /><button type="button" id="finishShow_${projectTask.ProjectTaskId}" title="Show Calendar"><img src="~/Content/yui/assets/calbtn.gif" width="18" height="18" alt="Calendar" ></button>
</div>
</div>
</td>
</tr>
</for>
</table>
FYI: ${} are used to output variables in the Spark View engine.
I am also using the YUI 2.7 Connection to make Ajax calls to update the datebase for "change" and "enter/tab key press" events. I am able to verify that the AJAX calls are made correctly and the form field values are still valid.
The problem occurs when I just do a F5 refresh; for some reason, the "finishDate_1" gets populated with the value from "date_1".
This problem occurs just by clicking on "date_1" and hitting F5; so, the adjacent field just gets populated even if there are no AJAX calls.
Here's the Javascript code I call towards the end of the body"
YAHOO.util.Event.onDOMReady(
function() {
var idList = YAHOO.util.Dom.getElementsBy(function (el) { return (el.type == 'hidden'); }, 'input');
len = idList.length;
var startDatePickers = new Array();
var finishDatePickers = new Array();
for (var i = 0; i < len; i++) {
var id = idList[i].value
startDatePickers[i] = new DatePicker("date_" + id, "show_" + id, "cal_" + id);
startDatePickers[i].valueChanged.subscribe(updateDate, 'S');
finishDatePickers[i] = new DatePicker("finishDate_" + id, "finishShow_" + id, "finishCal_" + id);
finishDatePickers[i].valueChanged.subscribe(updateDate, 'F');
}
}
}
The form field gets copied over before any Javascript code is processed because I call the Javascript code towards the end of the body after all HTML is rendered. So, I'm guessing it's a refresh issue in Firefox? What do you guys think?
As you can see above, I created my own calender date picker objects which allows you to either enter the date in the text manually or by clicking on a button to view the calendar and select a date. Once you enter or select the date, an AJAX call will be made to update the datebase in the back end.
Thanks everybody for the quick responses.
#Anonymous: whoever you are, you are awesome!
#bobince: thanks for the feedback as well.
I added a dummy form tag with the attribute autocomplete="off" and that solved the problem!
I was scratching my head because I didn't get this issue in Safari 4.0.3 or Internet Explorer 8.
<form action="" autcomplete="off">
<!-- my code -->
</form>
The values were loading correctly in the back end (ASP.NET MVC 1.0/Spark View engine) and the HTML source code reflected this, but the input field values were not getting populated correctly. I was using the YUI Connection Manager and Javascript to support edit-in-place and the date pickers.
I tried changing the XHR call to a GET call instead of POST and the same issue was happening.
Anyway, the problem was that the Firefox was not setting the correct values for the input fields for F5 refreshes.
Again, thanks so much! You guys rock!
All element id's must be unique, if two elements have same id's then that could be reason why Firefox inserts same values to elments that didn't orginally have those values entered.
I had a similar problem related to my question at Input control shows incorrect value, even 'though inspect element shows the right value is there
The problem occurred for me in Firefox, but not Chrome, for some but not all controls on the form, and when I pressed F5, but not ctrl-F5.
The "dummy form" seems to have resolved it for me.

Resources