By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
428,601 Members | 989 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 428,601 IT Pros & Developers. It's quick & easy.

Show/Hide table row

P: n/a
Aly
I am building a site that sells 3 standard packages and one custom package.
On the package selection page, I want the following:

Upon loading the page, I want the package selections (Basic, Standard,
Advanced, and Custom) to be visible, as well as an Email field and Payment
Method field.

I want nothing to happen when Basic, Standard, or Advanced are clicked. When
Custom is clicked (radio buttons for all), I want the custom options to
appear. If Basic, Standard, or Advanced are chosen again, I want the custom
options to disappear.

I have found a few different codes, but none of them do exactly what I am
looking for. I have seen it done, and tried to copy the code, but it didn't
work. I'm assuming there was something in a .js file that affected it.

If anyone could help, I would be greatly appreciative.

Aly
Jan 17 '06 #1
Share this Question
Share on Google+
4 Replies


P: n/a
Aly
Following up on myself...

I have found one script that almost does what I want. However, I'm unsure
how to make it work for more than 2 options. Here is the basic page html
including the script so that someone may be able to help me.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<script language="JavaScript" type="text/JavaScript">
function ref(object)
{
if (document.getElementById)
{
return document.getElementById(object);
}
else if (document.all)
{
return eval('document.all.' + object);
}
else
{
return false;
}
}

function expand(object)
{
var object = ref(object);

if( !object.style )
{
return false;
}
else
{
object.style.display = '';
}

if (window.event)
{
window.event.cancelBubble = true;
}
}

function contract(object)
{
var object = ref(object);

if( !object.style )
{
return false;
}
else
{
object.style.display = 'none';
}

if (window.event)
{
window.event.cancelBubble = true;
}
}

function toggle(object)
{
object = ref(object);
if( !object.style )
{
return false;
}

if( object.style.display == 'none' )
{
object.style.display = '';
}
else
{
object.style.display = 'none';
}
}
</script>

</head>

<body>
<table width="100%" border="1" cellpadding="5" cellspacing="0"
bordercolor="#000000">
<tr>
<td bgcolor="#CCCCCC">
Hide Extra Content
<select name="select" onchange="toggle('morestuff'); return false;">
<option value="Yes" selected>Yes</option>
<option value="No">No</option>
</select></td>
</tr>
<tr>
<td bgcolor="#CCCCCC">Here is some content that shows. </td>
</tr>
<tbody id="morestuff" style="display: none">
<tr>
<td bgcolor="#33FF00"><p>This is hidden content</p>
</td>
</tr>
<tr>
<td bgcolor="#FFFF00">This is hidden content </td>
</tr>
<tr>
<td bgcolor="#FF66CC">This is hidden content </td>
</tr>
</tbody>
<tr>
<td bgcolor="#CCCCCC">Here is more content that shows. </td>
</tr>
</table>
</body>
</html>
Jan 17 '06 #2

P: n/a
On 2006-01-17, Aly <al********@shaw.ca> wrote:
I have found a few different codes, but none of them do exactly what I am
looking for. I have seen it done, and tried to copy the code, but it didn't
work. I'm assuming there was something in a .js file that affected it.


more likely there was something wrong with the HTML

Bye.
Jasen
Jan 19 '06 #3

P: n/a
On 17/01/2006 18:45, Aly wrote:

[snip]
Upon loading the page, I want the package selections (Basic, Standard,
Advanced, and Custom) to be visible, as well as an Email field and Payment
Method field.

I want nothing to happen when Basic, Standard, or Advanced are clicked. When
Custom is clicked (radio buttons for all), I want the custom options to
appear. If Basic, Standard, or Advanced are chosen again, I want the custom
options to disappear.


Could you please post a link to the document as it stands now. It would
be much easier to describe a solution if we can see precisely what
markup will be involved (especially if changes to that markup are
necessary).

[snip]

Mike

--
Michael Winter
Prefix subject with [News] before replying by e-mail.
Jan 19 '06 #4

P: n/a
Aly

"Michael Winter" <m.******@blueyonder.co.uk> wrote in message
Could you please post a link to the document as it stands now. It would be
much easier to describe a solution if we can see precisely what markup
will be involved (especially if changes to that markup are necessary).


Actually, it's not necessary :) I managed to figure it out on my own, and it
now works marvelously :) Thanks, though!

Aly
Jan 19 '06 #5

This discussion thread is closed

Replies have been disabled for this discussion.