I am using a html form like this:
<form action="question" method="get">
where question is a java servlet class which renders the data from the form and display on other page.
What I am trying to do is display this data just below the html form not on other screen.
(Somewhat like the page where we Ask Question in stackoverflow.com where the question you enter is rendered and displayed below.)
So I am trying to do same. Anyone has an idea how to do that?
The simplest way to do it, is to use javascript (client side).
Below is a very crude example on how to do this. This will give you an idea on how to proceed.
create a html page, with two separate text area boxes.
Let the first text area box be the source where you type in the text.
Assign it an id 'source_area'.
<textarea id='source_area'>
</textarea>
Let the second text area box be the destination.
Assign it an id 'destination_area'.
Set this area as "readonly" because you don't want users typing here directly.
<textarea id='destination_area' readonly>
</textarea>
Now when a user types into the first box, we need to capture the particular action.
For this example I will use the "onKeyUp" to capture events when a keyboard key is released.
Now when typing into the source text box, a key on your keyboard is released, it will invoke a javascript function "transferToNextArea()" is invoked.
We will create the javascript function "transferToNextArea()" in
Read more about javascripts here. http://w3schools.com/js/js_events.asp
Complete list of events here. http://w3schools.com/jsref/dom_obj_event.asp
The javascript function will extract text from 'source_area' text box.
It will then assign the same text into 'destination_area'.
function transferToNextArea()
{
//extracting text.
var varSrcText = document.getElementById("source_area").value;
//assigning text to destination.
document.getElementById("destination_area").value=varSrcText
}
Complete html (tested in Google Chrome)
<html>
<body >
Source Box
<textarea id='source_area' onKeyUp="transferToNextArea();">
</textarea>
<br>
Destination Box
<textarea id='destination_area' readonly>
</textarea>
</body>
<script type="text/javascript">
function transferToNextArea()
{
var varSrcText = document.getElementById("source_area").value;
document.getElementById("destination_area").value=varSrcText
}
</script>
</html>
This is just a very basic example. It is not very effecient, but it will give you an idea of how data can be moved around.
Before assigning the text, you could manipulate the text however you want it using javascript.
Stackoverflow formats the text as per the html tags after extracting it. This will require lot more code and more work.
Using a servlet for the above task is overkill.
You would use a servlet, only if you want to do something with the data on the server side.
Example
a) store it in a database before displaying it below.
Read about "ajax" calls to send and recieve data between the server and client.
Ajax will give you the means to send data to the servlet without having to refresh the whole page.
Create a JSP with a form
on submit post the data to some servlet
process request and produce resultant data and set it to request's attribute
forward the request to same jsp
check if the data is not null display under the form
Just let the servlet forward the request to the same JSP page and use JSTL <c:if> to conditionally display the results.
request.setAttribute("questions", questions);
request.getRequestDispatcher("/WEB-INF/questions.jsp").forward(request, response);
with
<c:if test="${not empty questions}">
<h2>There are ${fn:length(questions)} questions.</h2>
<c:forEach items="${questions}" var="question">
<div class="question">${question}</div>
</c:forEach>
</c:if>
See also:
Our servlets wiki page - Contains concrete Hello World examples.
Related
i want pass data /innerHTML to the another jsp page ,so how could i pass it ?is it possible to use arraylist or any other way to pass this large data to another page?
Is it possible add tag data to the arraylist in javascript?or how can we pass div tag innerhtml to the next page in jsp?
i want pass data /innerHTML to the another jsp page
This seems wrong approach to me,because the main adavantage of Jsp is actually writing HTML on demand,where ever you need it.
Pass the essesntial data which decides the html to the jsp using the session or request but passing html is a bad idea.
Instead of passing the HTML view data, just pass what needs to be displayed and let the target JSP decide how to render it. For example, if you wanted the target JSP to print a welcome message for the logged-in user; then instead of passing the HTML
target.jsp?msg=<div><p>Welcome <b>John</b></p></div>
You would pass a request attribute named user as
request.setAttribute("user", "John");
which can now be accessed in your target JSP (using EL) as
<c:if test="${not empty user}">
<div><p>Welcome <b>${user}</b></p></div>
</c:if>
In your case, your Cart along with its List<CartItems>, should be stored in HttpSession. This way the shopping data remains accessible to any JSP/Servlet that needs to update the cart.
Wrap your div tag div tag. and get the html tags from ouside wrapper div tag.
<div id="wrapper">
<div id="what_you_want">
some contents...
</div>
</div>
$("#wrapper").html() - It contains whole html code in wrapper div.
Try some Javascript. If you really insist on using kinda abnormal methods (I do too sometimes), you can create an input field of type hidden and put the cart info into that input as a delimited string.
I have two different divisions in a JSP page. One contains a menu of links, when clicked the div2 (id-content) loads different pages accordingly. I am doing something like -
<div id="menu">
<ul class="navbar">
<li><a name="login" href="Login.jsp" onclick="changeContent()">Login</a>
</li></div>
and in the script I have something as -
<script language="JavaScript">
function changeContent() {
document.getElementById('content').load('Login.jsp');
}
</script>
I also tried -
document.getElementById('content').innerHTML=
"<jsp:include page="Login.jsp">";
None of the ways worked. Please suggest how should I
Try jquery..
function changeContent() {
$('#content').load('Login.jsp');
}
The solution is to use Ajax, which will asynchronously retrieve your page content that can be pasted in with the innerHTML method. See my answer to a similar question of how an Ajax call works and some introductory links.
As to why your examples in your answer don't work, in the first case there is no load() method on an Element object (unless you've defined one yourself and not shown it). In the second example, as one of the question comments says, there is probably something causing a syntax error in the javascript.
As an FYI, when there is a syntax error in some javascript in a web page, the current expression being parsed and the rest of the <script></script> block will be ignored. Since this is inside a function declaration, that function will never get defined.
For instance, an embedded quote in the included page will end the string for the innerHTML assignment. Then the javascript parser will try to parse the remainder of the HTML causing a syntax error as the HTML will not be valid javascript.
We use jquery. Add a click event handler to the anchor elements. In the click handler call $('#content').load(your_url);. You might want to use the load(url, function() { ...}) version. More info here http://api.jquery.com/load/
Your initial page comes down from the server. It's displayed by the browser. When you click on a link (or a button) in the browser, you want to fill the second div with new HTML. This is is a perfect job for an AJAX request. What the AJAX object in the browser does, is to send a POST (or whatever) string to the server. And then the Ajax object receives the HTML response back from the server. And then you can display that response data which the AJAX object contains, anywhere you want.
I know it must be simple, but still I am not able to figure it out.
I have a link on a jsp page.
When this link is clicked I want another tab (of browser) to open up.
The view of this new page is defined by action class, which needs a form field value.
The problem I am facing is that I can not get the values of form fields to the action class without submitting the form. And submitting the form changes the view of the original jsp as well, which defeats the whole purpose of opening a new tab.
So I need a way to get the form field values to action class without resetting the view of original jsp page.
One way I came across was URL re-writing but that would be my last option.
Please suggest something!!
Thanks!!
Firstly I would like to point out that currently possible (to my knowledge anyway) to force a new tab to appear, it is dependent on the users' browser and the settings that they have see here for more infomation.
Now onto your question, since links cannot send form data (on their own) you have 2 options:
You can use a form "submit" button pointing to the URL you want to send the data to and to and add the target="_blank" to the form which will cause a new page to open up when the form is submitted.
You can add a javascript event to your link so that when it is pressed you append the value of the input to the URL and open a new window with that URL.
Personally I would choose the first option.
Here is a simple example of option one which doesn't remove the input value when you submit...
<html>
<body>
<form action="test1.html" method="post" target="_blank">
<input type="text" name="bob" />
<input type="submit" value="Hello"/>
</form>
</body>
</html>
You could do an ajax call, or dynamically build the link url with get parameters in it.
I am a beginner in the JSP World as per I have noticed that, there is one form tag which has action and method attribute. In action tag we must write the URL of the servlet which gets activated after clicking the submit button.
But my problem start here. I am trying to develop a register page.
I have two servlets:
one checks for the availability of existing user,
second register the user.
Does anyone have any idea how to achieve it without a href link or image button?
Move the code that checks for availability of the existing user and register the user to its own service class say UserService. Make the form submit to 2nd servlet which uses UserService to perform both the operations.
You can have two separate forms but not nested forms in HTML. If you want a single form to change its actions (its target URL) depending on which submit is used, the only way you can achieve that is through javascript.
You can do this with your existing approach by registering a Javascript function
<body>
<script type="text/javascript">
function submitType(submitType)
{
if(submitType==0)
document.userForm.action="CheckUserAvailability.do";
else
document.userForm.action="RegisterUser.do";
}
</script>
<form name="userForm" method="post">
--Other elements here
<input type="submit" value="Check User Availabiliy" onClick="submitType(0)"/>
<input type="submit" value="Check User Availabiliy" onClick="submitType(1)"/>
</form>
</body>
Yes You can.. In the action you give the Servlet name. and inside that servlet you can call java methods which are written in other classes.
Which means you can check
1.one checks for the availability of existing user
2.second register the user
Using two java classes(may be according to your choice)
Just call those methods with in the same servlet..Guess you got an idea.
I'm writing a testing utility- I want to show multiple finished HTML "pages" in a single browser window.
Is this possible? I'm using Java Servlets.
For example, normally the user goes to a utility screen, fills in a bunch of fields and POSTS this to my servlet, which builds up a full HTML stream based on their input and writes it to HttpServletResponse.getWriter(). When the user views source, they get a <html> ... </html>.
What I want to do is allow users to request multiple "screens" and get the results in a single web page where you'd scroll down to see the 2nd, 3rd, etc. screens, maybe there is some kind of divider in between. I thought of frames or iframes, but didn't have luck. I have seen where I can write my big html stream to a javascript variable, then use document.write to dump it into the iframe. But that seems pretty awkward, and I'd have to be really careful about escaping quotes and stuff.
You will have to use iframes or frames to do this. A single web page can only contain one set of html tags and thus one html page.
Another idea would be to render the page by your script and then capture a picture of it and then have a page containing images. You will of course loose all interaction with the page.
I'm not sure what you're trying with your frames, but I imagine frames should work OK for what you've described.
Instead of trying to post to more than one URL from your form, you just post to a servlet that returns a page with the frameset, and each frame has a source that points to one of the URLs you want to test. For example:
<form action="testServlet" method="post">
<input type="text" name="someValue" />
</form>
The testServlet then returns a page with this content:
<frameset rows="33%,33%,33%">
<frame src="testUrl1?someValue=value">
<frame src="testUrl2?someValue=value">
<frame src="testUrl3?someValue=value">
</frameset>
The only problem with this is that you're doing a GET instead of a POST, but that's easy to get around. All you would need do is to implement the doGet method within your servlets and just call doPost from within doGet.
Just leave out the <html>/</html> tags for each page and wrap the whole thing inside a single large ....
Like this maybe:
<html>
[page1Content]
<hr />
[page2Content]
<hr />
[page3Content]
<hr />
</html>