i have a requirement where i need to display some fields on the JSP. These fields are dynamic in nature, meaning, for ex:, if i changed some value in the dropdown, some fields will be hidden and some other fields might come. I dont want to write Javascripts for show/hide of divs, rather want logic to be coded somewhere at server side.
I have an idea of implementing a custom tag library, but i wnat if i could get an out of the box solution.
any new suggestions or solutions are welcomed.
You had better do it in JavaScript. Having said that, you can send AJAX request to get the new form fields based on the input provided. For example, have a <div> to set the HTML coming from the server.
Use struts framework , there are some tags which can hide and show fields based on values
Logic/logicout tags example
If you want to use a web framework, try Struts 2. It provides tags like <s:if test="some ognl expression" ...> to selectively render html content.
Otherwise you could just go with the JSTL core tags, which provide a <c:if text="some Java EL expression" ...> and a <c:choose ...> tag ( Example ).
Remember to reload the page after changing select box values in order to update the UI.
For this some JavaScript might be needed.
DOM (Document Object Model) in Javascript is very powerful and cross browser.
to remove a node on UI
1.removeChild(nodename)
to add a node on UI
2.elementNode.insertBefore(new_node,existing_node)
I used it. it works well.
more information on DOM.
http://www.w3schools.com/dom/default.asp
Related
I use Thymeleaf with Spring MVC 4.1.1 and I want to be able to re-use my Spring messages (with the user's automatically detected locale) for my JavaScript files. E.g. I want to do:
$('#fooTitle').text(messages['foo.title']);
...and #fooTitle would contain the value under foo.title for the user locale.
What would be the easiest way to do this? Note that I would like a JavaScript object ("dictionary") or another data structure which is easy to navigate.
If not the easiest (but admittedly easy enough), the cleanest and most robust way is to use html5 data attributes to pass back-end data to js. This way, no matter if you move your javascript to external files, it still works. Use some element as container (choose the most proper for your case) as a carrier of the thymeleaf back-end retrieved i18n values and then access them with jQuery
in html:
<div id="container" th:attr="data-foo-title-txt=#{foo.title}"></div>
in js:
$('#fooTitle').text($("#container").data("foo-title-txt"));
See also my older similar answer, (although the OP has not left any sign of life after that :) )
,
JavaScript, Thymeleaf and localizing text
The easiest way to include localization messages would be:
$('#fooTitle').text([[#{foo.title}]])
I have a basic Java Tag (called PluginTag), which extends TagSupport. This tag adds some behaviour to the calling JSP using the JspWriter instance, e.g.
this.pageContext.setAttribute("plugins", someBehaviour);
I would like to extend this tag, so that it injects HTML meta data into HEAD of the html document. So as explained, the tag has a JspWriter, and not much else...
Also, by the time PluginTag is invoked, another tag will have written the HEAD and any META data out. The trick is I cant update this tag to do my work - and in any case would like the PluginTag to handle my META data, if possible.
I seen a few things like apache HtmlElement, but dont think they are applicable from the context of a Tag.
Thanks.
It's impossible to access HTML document which is formed outside the custom tag. The reason is that previously formed HTML could have been flushed to the user-agent already while other has not been formed yet.
Another way to change shipped to the client and rendered HTML document is to use a custom tag which includes some JavaScript that changes the needed HTML-document elements.
Is that possible to generate THEAD in a TABLE in GWT ? Do I have to create my own Widget ?
I'm following the Google Tutorial on GWT, https://developers.google.com/web-toolkit/doc/latest/tutorial/gettingstarted... but when see the generated HTML I get sick :o)
So I gess that yes I can use whatever I need to use to be able to generate better HTML.
In fact, I have to report if I can do good HTML/CSS/JS whith this technology. So I try to know what is possible to do with GWT.
Column headers of CellTables will be rendered in a <thead> section.
You can also use HTML with an HTMLPanel (made much easier using UiBinder) if you don't need to manipulate the table's structure dynamically (assuming you're putting widgets in there, otherwise you can very well do whatever you want with it; this is because widgets have a specific lifecycle to avoid memory leaks with event handlers).
I'm working on a java web application, I m using spring mvc and jsp pages.
What I am doing:
On a jsp page, I m receiving from a controller an arraylist with wave objects, which are defined as a java class (model) and contain the attributes: name, start date, end date.
I am populating a dropdown element from the arraylist with the attribute. name for the wave objects.
<c:forEach var="wave" items="${waveList}" varStatus="iter">
<option value="${wave.name}">${wave.name}</option>
</c:forEach>
The problem:
How can I use the other attributes (startdate, enddate), for the wave which is selected from the dropdown and show them on the jsp page, under the dropdown, without refreshing the page.
I know I have to use javascript, but i don't know javascript, I'm guessing it's not a complicated thing to achieve this. If you guys could give me the answer or direct me to a tutorial or something... I would appreciate it!
you need to use AJAX to query the server to get the extra information from the server.
I think w3c issued a great tutorial for AJAX, you don't need to know a lot about JS
http://www.w3schools.com/ajax/ajax_intro.asp
After you understood the basic principle of JS and AJAX, you need a framework to do good and easy JS. I advice jQuery: http://docs.jquery.com/Tutorials:Getting_Started_with_jQuery
If you could make slight design change you could avoid the additional HTTP (AJAX) request.
<option value="${wave.name}">${wave.name}</option>
Instead of "name" in value attribute, you could store your end date and start date as a string with a delimiter (enddate::startdate) and in JS you could define an onclick/onSelect/onChange listener for the select retrieve the selected value.
For Javascript snippet for Select (HTML):
Get selected value in dropdown list using JavaScript?
AJAX is a very powerful tool so I am struggling with it :-).
Is there any way or API(in java) so that I can get the HTML code which is generated by AJAX?
Generally, AJAX make use of inner HTML code and hence this inner HTML code is missing when I look into the page source of a page.
e.g click here
Just see the section OTHER NEWS. The content is populated by AJAX. When I look into the page source the code is not there.
I need this HTML code through a java program. How can I get it?
To have a Java application use the content received via AJAX, you need to first find the URLs from where the content is getting called from. In case this it would be http://itm2083.com/get_wwo_content.php?featureGroupId=8355&featureDisplayLimit=1&sponsorName=vortalx&wwoDivCounter=5&domainUrlForWWo=http://item2083.com/&featureImgDisplay=FLAG_TRUE&featureGroupImageWidthLimit=200&featureGroupDefaultImageUrl1=http://wwo.itmftp.com/75x75.gif&featureGroupDefaultImageUrl2=http://wwo.itmftp.com/75x75.gif&featureGroupDefaultImageUrl3=http://wwo.itmftp.com/75x75.gif
The featureGroupId= parameter has 5 IDs: 8355, 8359, 8367, 8369, 8429. Use these to pull the content from the Other News box.
The featureDisplayLimit= parameter determines how much content is pulled from the server.
If you want the nice HTML as well, the Java app will have to recreate it, as the HTML rendered on the site is created by JavaScript code.