Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > show and hide

Reply
Thread Tools

show and hide

 
 
student4lifer@gmail.com
Guest
Posts: n/a
 
      09-10-2008
Could someone show me how to make the "someFunction()" in javascript
so that 'Make' and 'Model' appear only if the 'car' checkbox is
clicked? Thanks.

===========

<table>
<tr>
<td></td>
<td>
<input name="car" value="T" type="checkbox"
onclick="someFunction()"> Car
</td>
</tr>

<tr>
<td>Make:
</td>
<td><input id="made" size="20"></td>
</tr>
<tr>
<td>Model:
</td>
<td><input id="model" size="20"></td>
</tr>

</table>
 
Reply With Quote
 
 
 
 
Sherm Pendley
Guest
Posts: n/a
 
      09-10-2008
http://www.velocityreviews.com/forums/(E-Mail Removed) writes:

> Could someone show me how to make the "someFunction()" in javascript
> so that 'Make' and 'Model' appear only if the 'car' checkbox is
> clicked? Thanks.


JavaScript is off-topic here. Try asking in a JavaScript group, such
as comp.lang.javascript.

sherm--

--
My blog: http://shermspace.blogspot.com
Cocoa programming in Perl: http://camelbones.sourceforge.net
 
Reply With Quote
 
 
 
 
student4lifer@gmail.com
Guest
Posts: n/a
 
      09-10-2008
On Sep 10, 2:12*pm, Sherm Pendley <(E-Mail Removed)> wrote:
> (E-Mail Removed) writes:
> > Could someone show me how to make the "someFunction()" in javascript
> > so that 'Make' and 'Model' appear only if the 'car' checkbox is
> > clicked? Thanks.

>
> JavaScript is off-topic here. Try asking in a JavaScript group, such
> as comp.lang.javascript.
>
> sherm--
>
> --
> My blog:http://shermspace.blogspot.com
> Cocoa programming in Perl:http://camelbones.sourceforge.net


I got the javascript function() to work on <td> but not on <tr>, once
I moved the <div> outside the <tr>, it stop working. What am I
missing? How would one fix this? Below is what I got. Thanks.

===========


<head>
<script type="text/javascript">
<!--
function show(id, checkbox) {
var visible = (checkbox.checked) ? "block" : "none";
document.getElementById(id).style.display = visible;
}
//-->
</script>
</head>

<table>
<tr>
<td></td>
<td>
<input name="car" value="T" type="checkbox"
onclick="show('div1', this)"> Car
</td>
</tr>
<div id="div1">
<tr>
<td>Make:
</td>
<td><input id="make" size="20"></td>
</tr>
<tr>
<td>Model:
</td>
<td><input id="model" size="20"></td>
</tr>
</div>
</table>
 
Reply With Quote
 
Sherm Pendley
Guest
Posts: n/a
 
      09-10-2008
(E-Mail Removed) writes:

> On Sep 10, 2:12*pm, Sherm Pendley <(E-Mail Removed)> wrote:
>> (E-Mail Removed) writes:
>> > Could someone show me how to make the "someFunction()" in javascript
>> > so that 'Make' and 'Model' appear only if the 'car' checkbox is
>> > clicked? Thanks.

>>
>> JavaScript is off-topic here. Try asking in a JavaScript group, such
>> as comp.lang.javascript.

>
> What am I missing?


The meaning of "off-topic."

> How would one fix this?


One would ask in a group where JavaScript is on-topic.

sherm--

--
My blog: http://shermspace.blogspot.com
Cocoa programming in Perl: http://camelbones.sourceforge.net
 
Reply With Quote
 
nice.guy.nige
Guest
Posts: n/a
 
      09-10-2008
While the city slept, Sherm Pendley feverishly typed:

> JavaScript is off-topic here. Try asking in a JavaScript group, such
> as comp.lang.javascript.
>


From http://www.html-faq.com/alt.html/?ontopic

"Although there are many specialised newsgroups dealing with Javascript,
CGI, stylesheets, webmastering, questions and discussions about it are still
welcome in alt.html. You may get a technically better answer in specialised
newsgroups. Many of the regulars in alt.html are also regulars in these
specialised groups anyway."

So, no. Javascript is not off-topic here.

Cheers,
Nige

--
Nigel Moss | http://www.nigenet.org.uk
Email not valid. (E-Mail Removed) - take the dog out!
"You're mother ate my dog!", "Not all of him..."


 
Reply With Quote
 
Sherm Pendley
Guest
Posts: n/a
 
      09-10-2008
"nice.guy.nige" <(E-Mail Removed)> writes:

> While the city slept, Sherm Pendley feverishly typed:


It was a dark and stormy night...

> So, no. Javascript is not off-topic here.


Sorry, my mistake.

sherm--

--
My blog: http://shermspace.blogspot.com
Cocoa programming in Perl: http://camelbones.sourceforge.net
 
Reply With Quote
 
Roy A.
Guest
Posts: n/a
 
      09-11-2008
On 10 Sep, 22:59, Ben C <(E-Mail Removed)> wrote:
> On 2008-09-10, (E-Mail Removed) <(E-Mail Removed)> wrote:
>
> > On Sep 10, 2:12*pm, Sherm Pendley <(E-Mail Removed)> wrote:
> >> (E-Mail Removed) writes:
> >> > Could someone show me how to make the "someFunction()" in javascript
> >> > so that 'Make' and 'Model' appear only if the 'car' checkbox is
> >> > clicked? Thanks.


[...]

> Get rid of the div. Put the id on the tr instead, and toggle its display
> property between "table-row" and "none", rather than between "block" and
> "none".
>
> i.e.:
>
> * * display = (checkbox.checked) ? "table-row" : "none";
> * * document.getElementById(id).style.display = display;


IE 6 and IE 7 has no idea of 'table-row', you would be better of using
an empty string. Then IE can pretend you wanted 'display:block', while
normal browsers can assume you wantet 'display:table-row', i.e.:

display = (checkbox.checked) ? "" : "none";

> That should work, but I haven't tested it, and nothing I say ever works
> in IE.


Internet isn't compatible with IE. Internet has to die!

> You might also want to look at visibility: collapse. I don't know the
> level of browser support for that either, but in that case you'd be
> using:
>
> * * visibility = (checkbox.checked) ? "visible" : "collapse";
> * * document.getElementById(id).style.visibility = visibility;


IE 6 and IE 7 has no idea of the value 'collapse' for the visibility
property.

> And you'd also want to set it on the tr. In any case you have to get rid
> of the div unless you put in either inside a table-cell or completely
> outside the table.


Yes, get rid of the divs. Her is my suggestion:

<table>
<tr>
<td></td>
<td><input name="car" value="T" type="checkbox"
onclick="someFunction(this)">Car</td>
</tr>
<tr id="make">
<td>Make:</td>
<td><input id="made" size="20"></td>
</tr>
<tr id="model">
<td>Model:</td>
<td><input id="model" size="20"></td>
</tr>
</table>

....

<script type="text/javascript">

var oldonload = window.onload;

if (typeof oldonload !== 'function') {
window.onload = someOnloadFunction;
} else {
window.onload = function() {
oldonload();
someOnloadFunction();
}
}

function someOnloadFunction() {

document.getElementById("make").style.display = "none";
document.getElementById("model").style.display = "none";

}

function someFunction( checkbox ) {
display = ( checkbox.checked ) ? "" : "none";
document.getElementById("make").style.display = display;
document.getElementById("model").style.display = display;
}

</script>

You might want do the onload part simpler, like:

<body onload="someOnloadFunction()">

but that could override other onload functions in external scripts.
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
show hide divs - show last state upon reload/post ll Javascript 2 05-01-2008 12:15 PM
Hide and Show Div on Page_Load Shapper ASP .Net 3 05-20-2005 02:34 PM
[HIDE LAN] Hide a part of hosts into the LAN at VPN users? Paolo Bresi Cisco 1 04-04-2005 02:41 PM
How to hide table rows and show them when user click a different row? RA ASP .Net 1 02-19-2004 10:53 PM
Q. About Show and Hide Edit and Delete Buttons Ather Ali Shaikh ASP .Net Datagrid Control 0 10-16-2003 06:26 AM



Advertisments