I have the following basic html table with a Java function to print only the table content However the Print button does nothing when clicked,I figure probably the java coding is the issue, however it is not working could I get a third pair of eyes to assist please
<html>
<body>
<table border="1" cellpadding="3" id="printTable">
<tbody><tr>
<th>First Name</th>
<th>Last Name</th>
<th>Points</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
<tr>
<td>John</td>
<td>Doe</td>
<td>80</td>
</tr>
<tr>
<td>Adam</td>
<td>Johnson</td>
<td>67</td>
</tr>
</tbody></table>
<br />
<br />
<button>Print me</button>
<script>
function printData()
{
var divToPrint=document.getElementById("printTable");
newWin= window.open("");
newWin.document.write(divToPrint.outerHTML);
newWin.print();
newWin.close();
}
$('button').on('click',function(){
printData();
})
</script>
</body>
</html>
When working with javascript, it is often useful to look at your browser's console. After opening this page, mine has the error:
ReferenceError: $ is not defined
$ is a global variable inserted by jQuery. Try adding
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
to the code. This will include the jQuery library.
The call to the javascript function is not correct. When you're using the '$' symbol it means that you're using JQuery. You have 2 options:
1 - Include the jquery library to your page:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
2 - Call the javascript function directly on the button on the 'onclick' event. This is the best option in your case:
<button onclick="printData()">Print me</button>
Change this var divToPrint=document.getElementById("printTable");
to this var divToPrint=document.getElementById("<%=printTable.ClientID>");
and add jquery library <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
Related
I have an HTML file that needs to update on the fly. Basically, I want to populate that HTML file based upon the details fetched from Database. Now I don't know how to update the HTML using any java API.
Example:
<head>
<title>Sample</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<h1>Sample File</h1>
<p>
<span class="abc">abc</span>
<span class="description"> Sample Document</span>
</p>
<table>
<tr>
<th class="label">Title</th>
<td>Sample Value</td>
</table>
</body>
Then Updating:
<table>
<tr>
<th class="label">Title1</th> <-------------- Updating the table value
<td>123</td>
</table>
Any suggestion will be really helpful.
If you need to constantly update the data on the page, without reloading it. Pay your attention to EventSource (js).
const source = new EventSource(url);
source.onmessage = function (e) {
handleResponse(e);
};
And on the java side it uses a controller that returns stream.
#RequestMapping(value = "/checkData", method = {RequestMethod.GET}, produces = "text/event-stream;charset=UTF-8")
...
return "data:" + data + "\n\n";
I want to pass arguments from HTML view to Java API in play framework.
I've written the following code. What changes should be done to successfully pass the arguments from Html view to API in java controller?.
When i tried passing it as #w.username and #w.email or by keeping '#w.username' or #w.username i've got error.
#import model.User
#(users: List[User])
<html>
<body>
<h1>Users</h1>
<table>
<thead>
<th>User Name</th>
<th>Email</th>
<th>Status</th>
</thead>
<tbody>
#for(w <- users) {
<tr>
<td>#w.username</td>
<td>#w.email</td>
<td>#w.status</td>
<td>
<form action="#routes.UserController.getUser(w.username,w.email)">
<input type = "submit" value="View Deatils">
</form>
</td>
</tr>
}
</tbody>
</table>
</body>
</html>
It must work just like you wrote it:
#routes.UserController.getUser(w.username,w.email)
i have three servlet. In first servlet i have Request Dispatcher so it is redirect to my Dynamic List.jsp file. The jsp file contains
<div class='feedItem'> <c:out value="${feed.tagRuleType}"> </c:out> </div>
<div class='feedItem'><input type="submit" value="Update" onClick="updateRows(${feed.configId})"></div>
<div class='feedItem'><input type="submit" value="Delete" onClick="deleteRows(${feed.feedId})"></div>
When i click on the update button i can able to call the servlet through javascript. Inside servlet i am using Request Dispatcher:
RequestDispatcher dispatcher = request.getRequestDispatcher("/FeedUpdate.jsp");
dispatcher.forward(request, response);
But it is not redirecting to FeedUpdate.jsp file
It is iterating the list object. Inside the tag i added update button. so when i click update button corresponding row id i will get for updating a record.
When i click the button i can able to call servlet and the get the id. when i redirect to the jsp page using Request Dispatcher inside the servlet it is not redirecting to jsp page.
Can anyone the give the suggestion why it is not redirecting to jsp file.
if you have used Jquery Ajax call to call your servlet, your dispatcher forward won't work. You may want do the redirect in the success method of Ajax:
jQuery.ajax({
type:"POST",
url : "servlet",
data : param,
success : function(data) {
windows.location.href='/myservlet?id='+data;
});
So basically you want to call other method in another JSP and takes id as the parameter, if yes, then you can do it this way :
<h3>Sections List</h3>
<c:if test="${!empty listSections}">
<table class="tg">
<tr>
<th width="80">Section ID</th>
<th width="120">Section name</th>
<th width="120">Section size</th>
<th width="120">Section position</th>
<th width="60">Edit</th>
<th width="60">Delete</th>
</tr>
<c:forEach items="${listSections}" var="section">
<tr>
<td>${section.sectionid}</td>
<td>${section.sectionname}</td>
<td>${section.sectionsize}</td>
<td>${section.sectionposition}</td>
<td><a href="<c:url value='/editsection/${section.sectionid}' />" >Edit</a></td>
<td><a href="<c:url value='/removesection/${section.sectionid}' />" >Delete</a></td>
</tr>
</c:forEach>
</table>
</c:if>
The method editSetion and RemoveSection can be in different JSP files as well, depends how you have mapped it. Is this what you are looking for? I cannot understand exactly what you want, as you have not provided much information, no code too.. Please add more code and properly explain if this is not what you expected.
I need a way to use a div as a submit button to send a form request to a Servlet, Or is there any other way to solve my problem. "logoutbutton" is the div.
<div class="logoutbutton">
<table width="100%">
<tr>
<td width="50px"><img src="img/usericon.png" width="44" height="44" /></td>
<td><a style="font-size:12px; font-family:Verdana, Geneva, sans-serif; color:#FFF"><% out.print(session.getAttribute("userid")); %></a><br />
<a style="font-size:20px; font-family:Verdana, Geneva, sans-serif; color:#FFF">Log Out</a>
</td>
</tr>
</table>
</div>
You need to call the your servlet which handles logout action for the link. You can do it using
Logout
After doing this, you can logout from doGet method of LogoutServet
I would use jquery for this and then listening for events on DOM obejcts is a peice of cake.
$(".logoutbutton").click(function () {
window.location.href = 'logout.url';
});
or
$(".logoutbutton").click(function () {
$.post( "logout.url" );
});
That's easy, use the 'onclick' event:
<div style="cursor:pointer;" onclick="submitForm();">...</div>
On the onclick you can also use
window.location.href='LogourServletUrlPattern';
if you don't want to call a function and invoke the sevlet directly
Wrap your DIV as part of your form and submit the form on clicking on DIV
<html>
<head>
<script>
function formSubmit()
{
document.getElementById("frm1").submit();
}
</script>
</head>
<body>
<form id="frm1" action="form_action">
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>
<div class="logoutbutton" onclick="formSubmit()">
<table width="100%">
<tr>
<td width="50px"><img src="img/usericon.png" width="44" height="44" /></td>
<td><a style="font-size:12px; font-family:Verdana, Geneva, sans-serif; color:#FFF"><% out.print(session.getAttribute("userid")); %></a><br />
<a style="font-size:20px; font-family:Verdana, Geneva, sans-serif; color:#FFF">Log Out</a>
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
Use jquery for achieving this with ease.
In the DOM
<div id="logout-button">Logout</div>
In javascript/jquery
$("#logout-button").click(function () {
alert("ajax call to end session");
});
Even if your not using jquery you could use the above to get a round about idea on how to achieve this.
You can use javascript to capture click event on the logoutbutton div and submit the form. Assuming you have a form with id 'myform':
<div class="logoutbutton" onclick="document.getElementById('myform').submit()">
Note that using this method the div isn't treated as a hyperlink by the browser, hence you can't do right-click-and-open-in-new-tab.
If your javascript gets complicated consider using library such as jquery.
I have the following HTML
<html>
<head>
<title>test</title>
</head>
<body>
<table>
<caption>table title and/or explanatory text</caption>
<thead>
<tr>
<th>header</th>
</tr>
</thead>
<tbody>
<tr>
<td id=\"test\" width=\"272\"></td>
</tr>
</tbody>
</table>
Test link
<img src=\"http://www.google.se/images/nav_logo95.png\" />"
</body>
</html>;
And I want to find the first link with jsoup and replace it with a text
Element elem = page.select("a[href=" + link.getUrl() + "]:contains(" + link.getName() + ")").first();
I can only replace the inner HTML with elem.html("foo") or print the outerHtml with elem.outerHtml()
Does anyone know how I can achieve this?
I found the answer!
TextNode text = new TextNode("foo", "");
elem.replaceWith(text);
Once you have found the element that you want to work with, you may apply the commands such as explained here: http://jsoup.org/cookbook/modifying-data/set-html
I could not get it right. I am trying this:
elemento.prepend("<a href='www.test.com'>");
elemento.html("Roberto C. Santos.");
elemento.append("</a>");
elemento.wrap("<a href='www.test.com'> </a>");
But I am getting this:
<td> <a style="" target="_self" title="" href="http://ivv.veveivv.vvzenes.com.br/mao/ara/ccacao" data-mce-href="resolveuid/5cc1c7c8c9efcacaaeedec22a9c69a54" class="internal-link">Roberto C. Santos.</a></td>
</tr>
I still don´t know the exact way to exchange the contents of an URL element.
I´d like to have, as the result:
<a href='www.test.com'> Roberto C. Santos.</a>"
How coul´d I erase the href that is inbetween?