Opening jsp pages in an iframe from a drop-down menu - html

Question

I'm creating an application in jsp & servlet. So I have created a home.jsp page it is a main page of an application and it contains a menu bar . When user clicks on menu item the following page should appear in my iframe and if user clicks on another menu item the selected page should appear in the same iframe.
I need a help.... The following code is creating a menu bar and menu item
<li>Master
<ul>
<li>Customer</li>
<li>Suplier</li>
<li>Item</li>
</ul>
</li>
<li>Transaction
<ul>
<li>Purchase</li>
<li>Sales</li>
</ul>
</li>
<li>Contact</li>
After menu bar I have a iframe in which I want to show a menu item.
I don't know how do i do this. please help me out

Answer 1

You will need to bind a function onclick of your <a> tag. Then using jQuery find the href of the <a> which is clicked, finally assign that href as src of your iframe
HTML
<li>Master
<ul>
<li>Customer</li>
<li>Suplier</li>
<li>Item</li>
</ul>
</li>
<li>Transaction
<ul>
<li>Purchase</li>
<li>Sales</li>
</ul>
</li>
<li>Contact</li>
<br />
<iframe src="" height="300" width="500"></iframe>
jQuery
$(document).ready(function () {
$('a').click(function () {
var target = $(this).attr('href');
$('iframe').attr('src', target);
return false;
});
});
Here's a working DEMO. I just changed the href of first two items as example.