I am converting a web page currently using Thymeleaf to instead use AngularJS.
I want to convert the follow block containing Thymeleaf
<form th:action="#{?deleteLog}" th:object="${log}" method="post" class="in-line">
<input type="hidden" th:value="${log.vid_id}" name="vid_id" />
<input type="hidden" th:value="${log.id}" name="id" />
<button type="submit" class="btn btn-danger">Delete</button>
</form>
These th:value variables are being passed to a #PostMapping method in my controller class that then uses those variables to delete an entry from my database.
How can I achieve this using AngularJS? Taking the same approach I have
<form th:action="#{?deleteLog}" method="post" class="in-line">
<input type="hidden" th:value="{{x.vid_id}}" name="vid_id" />
<input type="hidden" th:value="{{x.id}}" name="id" />
<input type="button" value="Remove" class="btn btn-danger" ng-click="removeRow(tableList.id)" />
</form>
The removeRow() function successfully removes the row from the table in the UI, I just need to send the {{x.vid_id}} and {{x.id}} values to the method in my controller class.
I am obviously not using correct syntax because I am getting parsing errors for the th:value="{{x.id}}" thymeleaf variables when I try to use Angular. I've also tried th:value="${{x.id}}"' and th:value="${{{x.id}}}".
I haven't been able to find anything online regarding passing an Angular variable. Is this even possible?
You shouldn't mix AngularJS (SPA framework for client-side HTML templating) with Thymeleaf (library for server side HTML templating). You should choose to do templating on server or client and stick with it.
Combining these two doesn't make sense at all.
Related
I have a request to make where I send in various parameters of an object. Right now, I send them through a GET request but that, as you know, shows all the values in the URL. In order to avoid it, I want to make it a POST request.
I am aware of 2 ways to make POST requests - form submit where method='POST' and AJAX. But since the request I will be calling returns a view, AJAX will not be a good idea. If I use the form method, there will be at least 8 object parameters which will have to be hidden. This is what I have now:
<form method="POST" action="/submit" modelAttribute="objName">
<input type="hidden" name="val1" value="val1" />
<input type="hidden" name="val2" value="val2" />
<input type="hidden" name="val3" value="val3" />
<input type="hidden" name="val4" value="val4" />
<input type="hidden" name="val5" value="val5" />
<input type="hidden" name="val6" value="val6" />
<input type="hidden" name="val7" value="val7" />
<input type="hidden" name="val8" value="val8" />
<button type="submit">Submit</button>
</form>
Is there a better way to do this? Because it creates a lot of hidden HTML markup and it doesn't feel like the ideal way to be going about the situation.
Thanks in advance. If there is anything wrong with the question, please let me know and I will make changes(new to SO) :)
I want to insert an Attribute into the html Code.
I tried this, but it's not working:
<div id="${var}"> ... </div>
I think you know what I mean. The attribute 'var' should be the id. I didn't find a solution...
You just need to use the th:attr attribute. It is explained in the reference documentation 5.1:
5.1 Setting the value of any attribute
Enter then the th:attr attribute, and its ability to change the value
of attributes of the tags it is set in:
<form action="subscribe.html" th:attr="action=#{/subscribe}">
<fieldset>
<input type="text" name="email" />
<input type="submit" value="Subscribe!" th:attr="value=#{subscribe.submit}"/>
</fieldset>
</form>
The
concept is quite straightforward: th:attr simply takes an expression
that assigns a value to an attribute. Having created the corresponding
controller and messages files, the result of processing this file will
be:
<form action="/gtvg/subscribe">
<fieldset>
<input type="text" name="email" />
<input type="submit" value="¡Suscríbe!"/>
</fieldset>
</form>
Use this
<div th:attr="id=${var}"> ... </div>
Thymeleaf only evaluates attributes that are prefixed with th:. Here is a list of the attributes that are evaluated:
http://www.thymeleaf.org/doc/tutorials/2.1/usingthymeleaf.html#setting-value-to-specific-attributes
In your case, th:id is already built in so you can simply do <div th:id="${var}"> ... </div> and it will work. th:attr, is used to define attributes that thymeleaf doesn't normally support.
I'm looking to create a hotel booking form that automatically generates a URL based on the information inputted into the form.
For example, if a person inputs the name of "John" and the date "12/23/1989" I need the form to generate a URL such as "fakeurl.com/n=JOHNd=12231989" and automatically direct to this link when the form is submitted.
Using a few tutorials (I don't know Java very well), I was able to piece this together:
http://codepen.io/JeremyMG/pen/ptaGE
However, I am unsure how to make the fields match up with the variables.
If anyone could give me a hand or post a working example, that would be great! Thanks guys.
<form method="GET" action="https://fakeurl.com">
<input type="text" name="n" value="john" />
<input type="date" name="d" value="12/23/1989" />
<input type="submit" value="submit" />
</form>
Set the FORM tag's METHOD attribute to GET
Kinda new to wicket and im wondering if its possible to use a AjaxButton in order to get form values from forms within the first form...
For example, using the "ajaxButton" below would it be possible to also get the value of "anothervalue" even though its not in the same form?
<form>
<input type="submit" wicket:id="ajaxButton" />
<input type="text" wicket:id="aValue" />
<panel>
<form>
<input type="text" wicket:id="anothervalue" />
</form>
</panel>
</form>
Wicket supports nested forms. When you submit the outer form, the inner one should also processed (validate params, update models).
I'm developing a Java/Spring web application. The problem I'm currently facing is that I'd like to have message from message.resources shown as an attribute in an HTML.
<input type="submit" name="login" value="login" />
So instead of the hardcoded value "login" I need to the value of
<spring:message code="general.submit" /> as the value attribute of that input tag. As the pages are all xml, it's no option to nest tags like
<input type="submit" name="login" value="<spring:message code="general.submit" />" />
as it does not compile. I could, of course, read the value in the Java controller and use a JSTL variable to display the value, but I think it would be too hackish and complicated, especially for pages with large amount of submit buttons. Is there some kind of elegant way of accomplishing what I want to do?
Use <spring:message> to store the value in a var, then reference that var using EL, e.g.
<spring:message code="general.submit" var="submitText"/>
<input type="submit" name="login" value="${submitText}" />