Discuss "drop down problem" in the JavaScript Programming forum.

todd2006 · #11 June 30th, 2008, 05:54 PM

I added the <tr> tag it doesnt work

I am using IE 7.0 will that cause any problems

I dont know whats going wrong

todd

Rebelle · #12 July 1st, 2008, 12:28 AM

Quote:

Originally Posted by todd2006

I added the <tr> tag it doesnt work

I am using IE 7.0 will that cause any problems

I dont know whats going wrong

todd

todd2006,

did you close the table too? </table>

richyrich · #13 July 1st, 2008, 03:37 AM

Quote:

Originally Posted by todd2006

I added the <tr> tag it doesnt work

I am using IE 7.0 will that cause any problems

I dont know whats going wrong

todd

Works fine for me in IE 7.0 as well.

Post the exact code that you have at the moment.

todd2006 · #14 July 1st, 2008, 10:07 AM

Hi,

Here is the code

when the page is first loaded I see a drop down it has two values member, non-member

but it also shows me the credit card div

When u select Member or non-member then it show the Payment options and then when u select one of them you should see the div's for them

Code:


<%
Option Explicit
Dim ReserveDisplaycredit, ReserveDisplaycash, ReserveDisplaycheck


ReserveDisplaycredit = "none"
ReserveDisplaycash = "none"
ReserveDisplaycheck = "none"

Response.write "ReserveDisplaycredit:-" & ReserveDisplaycredit & "<br/>"
Response.write "ReserveDisplaycash" & ReserveDisplaycash & "<br/>"
Response.write "ReserveDisplaycheck" & ReserveDisplaycheck & "<br/>"

%>
<head>
<title>Main</title>

<script type="text/javascript">
<!--
function getStyleObject(objectId)
{ 
	if (document.getElementById && document.getElementById(objectId))
		{
			return document.getElementById(objectId).style;
		}
	else if (document.all && document.all(objectId))
		{
		return document.all(objectId).style;
		}
	else
		{
		return false;
		}
}

function calloptionpay()
{
var sel_payway = document.getElementById("payway")
var getpayway = sel_payway.options[sel_payway.selectedIndex].text
alert(getpayway);

			
if(getpayway=="Cash")
{
alert("are we here");
hidecredit();
hidecheck();
changeDivcash('reservecash', 'block'); 
}
else if (getpayway=="Check")
{
hidecredit();
hidecash();
changeDivcheck('reservecheck', 'block'); 
}
else if (getpayway=="Credit Card")
{

hidecheck();
hidecash();
changeDivcredit('reservecredit', 'block'); 

}


}

function changeDivcash(the_div,the_change)
 {
	var the_style = getStyleObject(the_div);
	if (the_style != false)
		{
			the_style.display = the_change;
		}
  }

  function changeDivcredit(the_div,the_change)
 {
 alert("change credit");
	var the_style = getStyleObject(the_div);
	if (the_style != false)
		{
			the_style.display = the_change;
		}
  }

  function changeDivcheck(the_div,the_change)
 {
  alert("change check");
	var the_style = getStyleObject(the_div);
	if (the_style != false)
		{
			the_style.display = the_change;
		}
  }


function hidecheck()
 {
  alert("hide check");
	changeDivcheck("reservecheck", "none");
 }

 function hidecash()
 {
	changeDivcash("reservecash", "none");
 }

 function hidecredit()
 {
 alert("hide credit");
	changeDivcredit("reservecredit", "none");
 }


//form Validation ends 
// -->
</script>

</head>
<body>

<form name="frm1" id="frm1" method="post"  action="confirm.asp"> 


Status :

<select  name="Memtype" id="Memtype" onChange="this.form.action = '<%=Request.ServerVariables("Script_Name")%>'; this.form.submit();">
<option value="">Select Membership Status</option>
<option value="Member" <%if Trim(Request.Form("Memtype"))=Trim("Member") then Response.Write "selected" end if%>>Member</option>
<option value="Non Member" <%if Trim(Request.Form("Memtype"))=Trim("Non Member") then Response.Write "selected" end if%>>Non Member</option>

</select>

<%

Dim getMemtype
getMemtype=Trim(Request.form("Memtype"))


If Memtype <> "" then
%>
<table>
<tr>
<td>Payment Method:</td>
<td><select name="payway" id="payway" onChange="calloptionpay();">
<option value="">Select the Payment Type</option>
<option value="Cash">Cash</option>
<option value="Check">Check</option>
<option value="Credit Card">Credit Card</option>
</select>
</td>
</tr>
</table>

<%
End if
%>

<div id="reservecash" style="display: <%=ReserveDisplaycash%>;">
Cash
</div>

<div id="reservecheck" style="display: <%=ReserveDisplaycheck%>;">
check
</div>


<div id="reservecredit" style="display: <%=ReserveDisplaycredit%>;">
credit
</div>

</body>
</html>

todd2006 · #15 July 1st, 2008, 10:28 AM

Hi,

With this code it doesnt display the credit card div when the page is first loaded

I select the member type and then I see the payment option
when i select the payment option and then i should see the div but it doesnt display the div

I have to use javascript when the payment option is selected

Here is my code

Code:

<%
Option Explicit
Dim ReserveDisplaycredit, ReserveDisplaycash, ReserveDisplaycheck


ReserveDisplaycredit = "none"
ReserveDisplaycash = "none"
ReserveDisplaycheck = "none"

Response.write "ReserveDisplaycredit:-" & ReserveDisplaycredit & "<br/>"
Response.write "ReserveDisplaycash" & ReserveDisplaycash & "<br/>"
Response.write "ReserveDisplaycheck" & ReserveDisplaycheck & "<br/>"

%>
<head>
<title>Main</title>

<script type="text/javascript">
<!--
function getStyleObject(objectId)
{ 
	if (document.getElementById && document.getElementById(objectId))
		{
			return document.getElementById(objectId).style;
		}
	else if (document.all && document.all(objectId))
		{
		return document.all(objectId).style;
		}
	else
		{
		return false;
		}
}

function calloptionpay()
{
var sel_payway = document.getElementById("payway")
var getpayway = sel_payway.options[sel_payway.selectedIndex].text
alert(getpayway);

			
if(getpayway=="Cash")
{
alert("are we here");
hidecredit();
hidecheck();
changeDivcash('reservecash', 'block'); 
}
else if (getpayway=="Check")
{
hidecredit();
hidecash();
changeDivcheck('reservecheck', 'block'); 
}
else if (getpayway=="Credit Card")
{

hidecheck();
hidecash();
changeDivcredit('reservecredit', 'block'); 

}
var creditcardflag
creditcardflag="Yes"

document.frm1.elements["creditcardflag"].value = creditcardflag;

}

function changeDivcash(the_div,the_change)
 {
	var the_style = getStyleObject(the_div);
	if (the_style != false)
		{
			the_style.display = the_change;
		}
  }

  function changeDivcredit(the_div,the_change)
 {
 alert("change credit");
	var the_style = getStyleObject(the_div);
	if (the_style != false)
		{
			the_style.display = the_change;
		}
  }

  function changeDivcheck(the_div,the_change)
 {
  alert("change check");
	var the_style = getStyleObject(the_div);
	if (the_style != false)
		{
			the_style.display = the_change;
		}
  }


function hidecheck()
 {
  alert("hide check");
	changeDivcheck("reservecheck", "none");
 }

 function hidecash()
 {
	changeDivcash("reservecash", "none");
 }

 function hidecredit()
 {
 alert("hide credit");
	changeDivcredit("reservecredit", "none");
 }


//form Validation ends 
// -->
</script>

</head>
<body>

<form name="frm1" id="frm1" method="post"  action="confirm.asp"> 


Status :

<select  name="Memtype" id="Memtype" onChange="this.form.action = '<%=Request.ServerVariables("Script_Name")%>'; this.form.submit();">
<option value="">Select Membership Status</option>
<option value="Member" <%if Trim(Request.Form("Memtype"))=Trim("Member") then Response.Write "selected" end if%>>Member</option>
<option value="Non Member" <%if Trim(Request.Form("Memtype"))=Trim("Non Member") then Response.Write "selected" end if%>>Non Member</option>

</select>

<%

Dim getMemtype
getMemtype=Trim(Request.form("Memtype"))


If Memtype <> "" then
%>
<table>
<tr>
<td>Payment Method:</td>
<td><select name="payway" id="payway" onChange="calloptionpay();">
<option value="">Select the Payment Type</option>
<option value="Cash">Cash</option>
<option value="Check">Check</option>
<option value="Credit Card">Credit Card</option>
</select>
</td>
</tr>
</table>

<%
End if
%>
<%

getnowMemtype=Trim(Request.Form("Memtype"))
creditcardflagnow=Trim(Request.Form("creditcardflag"))


If (getnowMemtype <> "" And creditcardflagnow="Yes") Then
%>

<div id="reservecash" style="display: <%=ReserveDisplaycash%>;">
Cash
</div>

<div id="reservecheck" style="display: <%=ReserveDisplaycheck%>;">
check
</div>


<div id="reservecredit" style="display: <%=ReserveDisplaycredit%>;">
credit
</div>

<%
end if
%>

<input type="hidden" name="creditcardflag" value="<%=creditcardflag%>"/>


</body>
</html>

richyrich · #16 July 1st, 2008, 10:45 AM

I'm a bit lost now.

I copied the code in your second post but it gives me an error saying "Variable is undefined: 'Memtype'. If I change Memtype to getMemtype I then get an error saying Variable is undefined: 'getnowMemtype' which seems to be getting exactly the same value as getMemtype is.

If you're using the exact same code, how are you not getting these error?

I also notice you haven't added in all the tags I said that were missing. There's still no <html> or </form> tag.

todd2006 · #17 July 1st, 2008, 11:01 AM

Ok Richyrich I didnt type the Option Explicit statements thats why

I tried this function for show and hide of the div's

Code:

function calloptionpay()
{
var sel_payway = document.getElementById("payway")
var getpayway = sel_payway.options[sel_payway.selectedIndex].text

if(getpayway=="Cash")
{
switchid("reservecash");
}
else if (getpayway=="Check")
{
switchid("reservecheck");
}
else if (getpayway=="Credit Card")
{
switchid("reservecredit");
}
var creditcardflag
creditcardflag="Yes"

document.frm1.elements["creditcardflag"].value = creditcardflag;

}



var ids=new Array('reservecash','reservecheck','reservecredit');

function switchid(id)
{	
	hideallids();
	showdiv(id);
}

function hideallids()
{

	for (var i=0;i<ids.length;i++)
	{
		hidediv(ids[i]);
	}		  
}

function hidediv(id)
{
	
	if (document.getElementById) 
	{ // DOM3 = IE5, NS6
		document.getElementById(id).style.display = 'none';
	}
	else
	{
		if (document.layers) 
		{ // Netscape 4
			document.id.display = 'none';
		}
		else
		{ // IE 4
			document.all.id.style.display = 'none';
		}
	}
}

function showdiv(id) 
{
	//safe function to show an element with a specified id
		  
	if (document.getElementById)
	{ // DOM3 = IE5, NS6
		document.getElementById(id).style.display = 'block';
	}
	else
	{
		if (document.layers) 
		{ // Netscape 4
			document.id.display = 'block';
		}
		else
		{ // IE 4
			document.all.id.style.display = 'block';
		}
	}
}

It gives me an error saying Object required

todd2006 · #18 July 1st, 2008, 11:04 AM

richyrich,

In firefox the error is on this line

if (document.layers)

any ideas

todd

richyrich · #19 July 1st, 2008, 11:23 AM

Your code seemed exceptionally complicated for something quite easy. Try this:-

Code:

<%@LANGUAGE="VBSCRIPT"%>
<%
Option Explicit
Dim ReserveDisplaycredit, ReserveDisplaycash, ReserveDisplaycheck

ReserveDisplaycredit = "none"
ReserveDisplaycash = "none"
ReserveDisplaycheck = "none"
Response.write "ReserveDisplaycredit:-" & ReserveDisplaycredit & "<br/>"
Response.write "ReserveDisplaycash" & ReserveDisplaycash & "<br/>"
Response.write "ReserveDisplaycheck" & ReserveDisplaycheck & "<br/>"
%>
<html>
<head>
<title>Main</title>
<script type="text/javascript">
<!--
function calloptionpay()
{
var sel_payway = document.getElementById("payway")
var getpayway = sel_payway.options[sel_payway.selectedIndex].text
if(getpayway=="Cash")
{
changeDiv('reservecash','block');
changeDiv('reservecheck','none');
changeDiv('reservecredit','none');
}
else if (getpayway=="Check")
{
changeDiv('reservecash','none');
changeDiv('reservecheck','block');
changeDiv('reservecredit','none');
}
else if (getpayway=="Credit Card")
{
changeDiv('reservecash','none');
changeDiv('reservecheck','none');
changeDiv('reservecredit','block');
}
var creditcardflag
creditcardflag="Yes"
document.getElementById("creditcardflag").value = creditcardflag;
}
function changeDiv(the_div,the_change)
 {
document.getElementById(the_div).style.display=the_change;
  }
//form Validation ends 
// -->
</script>
</head>
<body>
<form name="frm1" id="frm1" method="post" action="<%=Request.ServerVariables("Script_Name")%>"> 
Status :
<select name="Memtype" id="Memtype" onChange="this.form.submit();">
<option value="">Select Membership Status</option>
<option value="Member" <%if Trim(Request.Form("Memtype"))=Trim("Member") then Response.Write "selected" end if%>>Member</option>
<option value="Non Member" <%if Trim(Request.Form("Memtype"))=Trim("Non Member") then Response.Write "selected" end if%>>Non Member</option>
</select>
<%
Dim getMemtype
getMemtype=Trim(Request.form("Memtype"))

If getMemtype <> "" then
%>
<table>
<tr>
<td>Payment Method:</td>
<td><select name="payway" id="payway" onChange="calloptionpay();">
<option value="">Select the Payment Type</option>
<option value="Cash">Cash</option>
<option value="Check">Check</option>
<option value="Credit Card">Credit Card</option>
</select>
</td>
</tr>
</table>
<%
End if
%>
<div id="reservecash" style="display: <%=ReserveDisplaycash%>;">
Cash
</div>
<div id="reservecheck" style="display: <%=ReserveDisplaycheck%>;">
check
</div>

<div id="reservecredit" style="display: <%=ReserveDisplaycredit%>;">
credit
</div>
<input type="hidden" id="creditcardflag" name="creditcardflag" value=""/>
</form>
</body>
</html>

Hope that helps.

todd2006 · #20 July 1st, 2008, 11:34 AM

it gives an error object required on this line

document.getElementById(the_div).style.display=the _change;

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
display problem with drop downs	todd2006	JavaScript Programming	3	May 5th, 2008 05:31 PM
drop down problem	todd2006	.Net Development	2	April 23rd, 2008 11:37 AM

Discuss "drop down problem" in the JavaScript Programming forum.

JavaScript Programming - Javascript is a cross-browser client-side scripting language. Discuss Javascript and AJAX related scripts here.