Drop Down Menu Problem

Hi All,

I have one problem in displaying a drop down menu.
I have created one header.jsp in which there is a drop down menu code.

Now, there is second jsp say home.jsp in which i am including header.jsp. But the problem is my drop down menu is getting hidden behind the page elements say a table having form.

Please, help me out solving this.

[code of header.jsp includes javascript code]

Ankit Mishra wrote:...But the problem is my drop down menu is getting hidden behind the page elements say a table having form...

How do you say so, do you see (part of) the element displayed. Can you post the relevant code snippet(s)?, it would be easier to see what's wrong...

Hi!

This may be of some help for identifying the problem:

Following is the header.jsp :

<%@ page contentType="text/html; charset=utf-8" language="java"
	import="java.sql.*" errorPage=""%>
<%@ page import="java.util.*"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ page import="com.dpcm.data.DPCMLoginResult"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>DPCM</title>
<link rel="stylesheet" href="header_navigation.css" />
<link rel="stylesheet" href="css/dpcm_style.css" />
<script type='text/javascript' src='javascript/jquery.js'></script>
<link rel="stylesheet" href="css/jquery-ui.css" />
<link rel="stylesheet" href="css/jquery.ui.datepicker.css" />

function jsddm_open()
{
   jsddm_canceltimer();
   jsddm_close();
   ddmenuitem = $(this).find('ul').css('visibility', 'visible');}

function jsddm_close()

{  
	
	if(ddmenuitem) ddmenuitem.css('visibility', 'hidden');
}

function jsddm_timer()
{  closetimer = window.setTimeout(jsddm_close, timeout);}

function jsddm_canceltimer()
{  if(closetimer)
   {  window.clearTimeout(closetimer);
      closetimer = 0;}}

$(document).ready(function()
{  $('#jsddm > li').bind('mouseover', jsddm_open)
   $('#jsddm > li').bind('mouseout',  jsddm_timer)});

document.onclick = jsddm_close;
</script>

</head>

<body>
<div id="header">
<% 
	DPCMLoginResult loginBean = new DPCMLoginResult();
	loginBean = (DPCMLoginResult)session.getAttribute("getData");
	
	%>
<table border="0" cellspacing="0" cellpadding="0" width="100%">
	<tr>
		<td></td>
		<td align="right">
		<div class="underlinemenu" align="right">
		<ul>
			<li><a href="dpcm_login.jsp"> Logout </a> | <a href="#">FAQs</a></li>
		</ul>
		</div>
		</td>
	</tr>
	<tr>
		<td align="left">
		<h2>D P C M</h2>
		</td>
		<td align="right">Welcome,${getData.firstName}
		${getData.lastName}</td>
		<td></td>
	</tr>

</table>
</div>

<c:forEach var="role" items="${getData.roleID}">
	
	<ul id="jsddm">
		<c:if test="${role=='1'}">
			<li><a href="#">Moderator</a>
			<ul>
				<li><a href="redirect.do?operationType=search">Assign SPRs</a></li>
				<li><a href="#">View SPRs</a></li>
				<li><a href="dpcm_moderator_dashboard.jsp">Dashboard</a></li>
				<li><a href="#">Reports</a></li>
			</ul>
			</li>
		</c:if>

Below is the page I am using the header.jsp for having menu on this page.

Any kind of help in this is much appreciated by me. Thanks for Vijitha for seeing it

First I see a combination of JSTL & scriptlets in the header.jsp? And Have you tested the header.jsp alone whether it works fine?