Hide/Show button for HTML email - java

I am generating an HTML email using a java program and need a Hide/Show button for some queries,
What would be an ideal approach for this?, shd i call a javascript from java program to do the same?.
I have a javascript module to do the show/hide feature but not sure how to integrate this to a java program.
Thanks..

Javascript is completely independent from any server-side framework or language, such as Java.
If you want to show or hide an HTML element on a page, try the following JS code:
document.getElementById("id").style.display = 'none';
And then, when you generate the HTML email using Java, include the queries you want to hide in a <div> with a specified ID.

Add a class to your generated html tags and use css to control the visibility and other styling.
<style type='text/css'>
.hid {display: none;}
</stle>
<div class='query1 hid'>...</div>
<div class='query2'>...</div>
<div class='query1 hid'>...</div>
Then update your javascript to manipulate the class attribute.
//in jQuery...
$("btn1").click(function() {
$(".query2").addClass("hid");
$(".query1").removeClass("hid");
});

Related

Call JSP function with JSoup

I'm trying to scrape a .jsp webpage with Jsoup. The page I'm trying to scrape is basically a 6 steps form, filling each form takes me to another one but to do so I must click a button that calls a jsp function. I don't know how to do so with jsoup.
So here is a piece of the jsp page I'm trying to scrape.
<img id="nextButtonId" onkeypress="disableButtons(this);onIntroductionFormSubmit()" height="50"
alt="suivant" title="suivant" src="/eAppointment54-etrangers/element/images/buttons/next.gif"
**onclick="disableButtons(this);onIntroductionFormSubmit()"** onmouseover="downNextSrcPicture(this);"
onmouseout="upNextSrcPicture(this);" style="display: block;">
I want to call the onclick methods onclick="disableButtons(this);onIntroductionFormSubmit(). Maybe there is a way I can do this without having to simulate the actual clicking.
Thanks in advance !!!
Jsoup is not a browser engine, it is just an HTML parser/writer. To do such a thing you should do one of these, I recommend the first one:
Implement the method yourself (it's probably just an HTTP call)
Use an automation library like Selenium (no experience)
(Not recommended) Run a full browser environment such as JavaFX WebView and inject code to do the action.

Extracting and processing textarea value form without changing the page

I have a JSP file in which there are two textareas and a submit button all in a form ;
<form action="" method="post">
<textarea name="inConsole" id="in" cols="100" rows="10"> </textarea> <br/>
<input type="submit" name="Send Command"/> <br/>
<textarea name="outConsole" id="out" cols="100" rows="10"></textarea>
</form>
this page is supposed to work like any SQL program. so the user types a command in the first textarea and clicks submit, then the value of textarea will be extracted to a field and a method will take care of the command and return a log (1 row inserted, error:bad syntax etc) which will be displayed in the second textarea.
I know how for example make a login page and send data and redirect user to a new page(new jsp) file if user pass is correct.
what I can't find is how can I do all the things that I said above without going to a new page while using form action.
I have checked other questions that linked the action attribute to a servlet which was confusing for me( the way that a servlet was called). I'm looking forward to use a simple scriptlet for this purpose like the one I used for my login page:
<%
DatabaseLoginTest dbLogTest = new DatabaseLoginTest();
if (dbLogTest.DBLoginChecker(request.getParameter("user"), request.getParameter("pass")) == true){
%>
<p>Login Successful</p>
<% } else { %>
<p>Login Failed</p>
<% } %>
also I'm aware that adding java scripts(not Javascript scripts:) ) to html isn't a good practice(and the reasons for it) but I think this might be easier for a simple program that I'm working on.
p.s: I'm using tomcat and Intellij for developing this web application
and I have made a custom SQL so I only need the code that gives me the textarea value and the one that sets the other one's value
Update: now I know I should use javascript but I don't know how can I send the data extracted by javascript to a java method.
If you want to do this while remaining in the same page, you have to use Javascript. This is because if you want the server to be able to re-render the page, there has to be a page refresh.
You would need to write onClick handler for the submit button and make a Ajax call to your server to a specific URL with the user input. This URL would serve the data needed for the necessary UI changes.
You can use a scriptlet to generate the HTML that would be shown in the webpage but this would only suffice for a simple use-case and it would be a lot simpler if, say, your service returned just the data required to make the UI change and actual UI change is handled by the JS.
Also,I don't think it is a bad practice to embed JS in HTML. Sure, you can optimize this by including a JS source file but that's a separate optimization.

Inject to GWT authorize.net Verified Merchant Seal

I have gwt app with payment feature. I would like to insert into UIBinder following code (provided by authorize.net for verified merchants. I added my site to Verified Merchant Seal Domains List on authorize.net server):
<div class="AuthorizeNetSeal">
<script type="text/javascript" language="javascript">var ANS_customer_id="MY_ID";</script>
<script type="text/javascript" language="javascript" src="//verify.authorize.net/anetseal/seal.js"></script>
MerchantServices
</div>
I tried following:
UIBinder:
<g:HTMLPanel>
<div class="AuthorizeNetSeal">
Merchant Services
</div>
</g:HTMLPanel>
and in constructor of the control after initWidget(...)
ScriptInjector.fromString("var ANS_customer_id = 'MY_ID';").inject();
ScriptInjector.fromUrl("//verify.authorize.net/anetseal/seal.js").inject();
Tried scheduleDeferred. Tried setCallback() for ScriptInjector.fromUrl. Success method is called.
But seal doesn't appear.
please help
Thanks
Add script elements to the head section of your host page. If scripts are small and/or you do not use code splitting, there is little to no advantage in using a ScriptInjector.
Verify with your browser console that the script loads correctly from a URL you provided.
You need to inject them in the correct window:
ScriptInjector.fromString("var ANS_customer_id = 'MY_ID';").setWindow(ScriptInjector.TOP_WINDOW).inject();
But the seal.js uses document.write so it cannot be injected that way anyway, it must be present in the HTML document when loaded by the browser.
You could put this snippet in your HTML host page in a hidden <div> that you later relocate (Document.get().getElementById(…) and other appendChild DOM methods) where you want it within your app.
…and you should ask Authorize.net to provide an async version of their script so that if their servers are slow they don't slow down the loading of your app.
Thanks for your answers. I created separate HTML page with html code above and inserted it to iframe.

How to build a portlet specific conditional in liferay

Our team built a custom portlet to load Google markers onto a map. The markers are created in the template script. We now would like to display these markers in another asset publisher in a list like format. Is there anyway to pass a conditional to the template file depending on the portlet that is requesting it? Or alternatively are there any good methods for building this code into the jsp rather than the template file?
//code that creates the markers on the full map
gmarker=new google.maps.Marker({position:new google.maps.LatLng("$Lattitude.getData()","$Longitude.getData()"),title:"$reserved-article-title.getData()",icon:gicon,map:map});
if(window.location.href.indexOf("fullmap") > -1) {
google.maps.event.addListener(gmarker, 'click', function() {
new google.maps.InfoWindow({content:
'<div id="node_content">
<div id="siteNotice"></div>
<h3 id="firstHeading" class="firstHeading">$reserved-article-title.getData(), $City.getData(), $Country.getData()</h3>
<hr class="m_spacer"/>
<div id="bodyContent">
<p class="gdes">$Description.getData()</p>
<img class="m_image" src="$Image.getData()"/>
</div>
</div>'
}).open(map,this);
});
}
gmarker.setMap(map);
//redirect code that opens the infowindow on load if the id paramater is not null
if(flag==true){new google.maps.InfoWindow({content:
'<div id="node_content" class="gs2">
<div id="siteNotice"></div>
<h3 id="firstHeading" class="firstHeading">$reserved-article-title.getData(), $City.getData(), $Country.getData()</h3>
<hr class="m_spacer"/>
<div id="bodyContent">
<p class="gdes">$Description.getData()</p>
<img class="m_image" src="$Image.getData()"/>
</div>
</div>'}).open(map,gmarker);
flag=false;
}
It is liferay 6.1 so we don't get to enjoy the luxuries of the latest release.
Here is a screen shot of the two portlets and what they are displaying as well as an example of what we are aiming for. A website that is very similar to what we are attempting can be found here. Were hoping for conceptual ideas on how to differentiate the portlets not code necessarily. Your help is very much appreciated.
If you want to use the same JavaScript function from diverse portlets, then the better way is to put the JavaScript function to the Theme
http://www.liferay.com/documentation/liferay-portal/6.2/development/-/ai/creating-themes-and-layout-templates-liferay-portal-6-2-dev-guide-09-en
and call the function from the portlet-jsp with different properties.
I am not sure if I understood your question correctly, but have you considered creating a custom Display Style for your asset publisher to achieve this? If not, check this out:
http://www.rotterdam-cs.com/blogs/-/blogs/hooking-the-asset-publisher-for-custom-display-styles
You can create a new display style with your Map on top and the list below, everything in one jsp (unless you break it down off-course). I think it will possibly resolve your problem.

GWT - easiest way to do a simple loading screen until file is loaded

When clicking a button, my GWT application returns a PDF file embedded in an HTML page which looks something like:
<html><head></head>
<body marginwidth="0" marginheight="0" bgcolor="rgb(38,38,38)">
<embed width="100%" height="100%" name="plugin"
src="http://myserver/?cmd=getMyPdf" type="application/pdf">
</body>
</html>
Problem is it can take a while for the server to create this PDF file, so what I want is a waiting screen with a loading animation which can have the PDF file download in the background, and then when the file is done, display the page as described above.
One obvious way would be to display a loading page, send an asynchronous command to the server and then once the onSucceed method is called, call the page as normal. Downside is I'd have to add some server-side logic for making the PDF creation work in the background...
Is there any way to do this client-side with the GWT API?
Did you see this stackoverflow question Detect when browser receives file download? Basically the answer given is that you set a cookie in the return response and wait on the client side for this cookie to be set. This can be done easily with GWT as it has a Scheduler (for the repeated timer check) and easy access to Cookies. You still need to make some server changes, but you don't have to create a background process.
I don't have the full answer, but the following code works for me in Safari, and maybe you can modify it, to make it work with other browsers, too (?):
<html><head>
<script type="text/javascript">
function showPdf() {
document.getElementById("loading").style.visibility = "hidden";
document.getElementById("pdf").style.visibility = "visible";
}
</script>
</head>
<body marginwidth="0" marginheight="0" bgcolor="rgb(38,38,38)">
<div id="loading"
style="position: absolute; background-color: white;">Loading...</div>
<iframe id="pdf" width="100%" height="100%" name="plugin"
src="http://myserver/?cmd=getMyPdf" onload="javascript:showPdf();"
style="visibility: hidden;"></iframe>
</body>
</html>
This is pure JavaScript - but could certainly be done with GWT, too. Note, that I'm using an iframe instead of embed, because embed doesn't really support the onload method (and embed is not a standard HTML element, as far as I remember).
The reason, why this may not be the full answer, is that Chrome fires the onload event as soon as the PDF starts downloading (but after the PDF generation on the server side has finished). I'm not sure, if this is what you want?

Categories