• Post Reply
  • Bookmark Topic Watch Topic
  • New Topic

Calling <jsp:include> tag from javascript

 
bhakti rishipathak
Greenhorn
Posts: 3
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Here is what I am trying to achiever -
I have a db query that returns multiple rows.
These rows are displayed in table.
The rows have a field (Column) EventID, which is a hyperlink. On clicking that hyperlink the value should be passed to another jsp page that will run 1 more query (using the EventId that was clicked) and display the results

Here is my code snippet -

<!-- displaying table with hyperlinks. populateTextArea function displays the event id that was clicked -->
<script>
function populateTextArea(string){
document.getElementById('textarea').value = string;
}
</script>

<c:forEach var="row1" items="${qryTickets.rows}">
<tr class="odd">
<td><a href="jumong_link" onclick='populateTextArea("${row1.EventId}")' >${row1.EventId}</a></td>
<td><c:out value="${row1.EventName}" /></td>
<td><c:out value="${row1.EventDescription}" /></td>
<td><c:out value="${row1.Application}" /></td>
<td><c:out value="${row1.CIName}" /></td>
</tr>
</c:forEach>

<a name="jumong_link"> </a>
<textarea id="textarea"></textarea>

Now, after clicking the hyperlink, the result of the executed query should be displayed on the same page - so I want to run jsp:include from within Javascript function
<jsp:include page="page1.jsp" flush="true">
<jsp:param name="event" value="document.getElementById('textarea').value "/>
<jsp:param name="password" value="rose"/>
</jsp:include>

any ideas on how to get this working.
To summarize the basic problem is on click I want to invoke a javascript function as well as run a jsp 3 link
 
jatan bhavsar
Ranch Hand
Posts: 299
Eclipse IDE Java
  • Likes 1
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Hi bhakti,

The best way can be open the pop up page once you click on the hyperlink.

Regards
Jatan
 
bhakti rishipathak
Greenhorn
Posts: 3
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Thanks Jatan,
I need to display the information on the same page, as I dont want users to close so many pop-ups.
Mouse hover over would be ideal in this scenario, but since I am very new to scripting, taking baby steps.
I know that 1 possible solution is using ajax call, but I have never used it before.
Please advise
 
Greg Charles
Sheriff
Posts: 2984
12
Firefox Browser IntelliJ IDE Java Mac Ruby
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
The tags, like <jsp:include>, <c:out>, etc., are evaluated at the server in order to create a page, usually in HTML, which is sent to the client. JavaScript is run on the client, and the tags simply don't exist there. The results the tags create exist in the rendered page, but not the tags themselves. If you want to update a page based on a client user's action, you have to submit a new request to the server and let it render a new page. If you don't want to re-render the whole page, you can use AJAX for the request, and update your DOM with the response.

On the other hand, the only thing you want to be dynamic is a <jsp:param>. You can't feed a client-side parameter to that tag (because the client doesn't see the tag), but you could search and replace the event in the area that's created.

So something like:



Then make your onclick handler look for the PLACEHOLDER values and replace them with document.getElementById('textarea').value.
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 64618
86
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I do similar things like this all the time: a resource is included in the JSP by <jsp:include> at initial load, and then updated dynamically via Ajax based upon user interaction.

Essentially all you need to do is to make an Ajax request to the same URL as the include (supply the params), and load the resulting HTML fragment into the DOM.

This is one line of code using the jQuery .load() method.
 
bhakti rishipathak
Greenhorn
Posts: 3
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Thank you Greg, I tried creating PLACEHOLDERs but I guess I could not reach a working solution.
Thank you Bear for pointing out jquery. I got a working solution with a combination of all solutions -
When I click on a link, function getEventID is called, which uses jquery load to load viewEventIDDetails with parameter eid
<script>
function getEventID(string){

var eid = string;
$("#div1").load("viewEventIDdetails.jsp?eve="+eid);
}
</script>

<td><a href="#" onclick='getEventID("${row1.EventId}")'>${row1.EventId}</a> </td>

Thank you
 
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic