Jump to content

Show/Hide problem


_tina_

Recommended Posts

Hi,

 

I have the following:

 

<script type="text/javascript">
<!--
    function toggle_visibility(id) {
       var e = document.getElementById(id);
       if(e.style.display == 'block')
          e.style.display = 'none';
       else
          e.style.display = 'block';
    }
//-->
</script>

--
<a  href="#" id="hide" class="hide" onclick="toggle_visibility('foo');">Test</a>

This works fine and do as expected, but then when I move them into my table (I want to show/hide a tr), it does nothing.

I also tried with JQuery and the same thing happened.

 

<script type="text/javascript"> 
$(document).ready(function(){

	$('a#hide').click(function(){
	$('#box').hide();
	return false;
	});

	$('a#show').click(function(){
	$('#box').show();
	return false;
	})

});
</script>

Does anyone know what is the problem?

 

Thank you.

Link to comment
Share on other sites

Hi,

 

Thanks for the reply.  Here is the table.

 

Thanks again.

 

<h1>Edit  <span><a href="<?=$this->url(array('action'=>'list'), null)?>">[return to listing]</a></span></h1>
<table border="0" cellpadding="0" cellspacing="0" class="edittable" id="pagetable">
<tr style="vertical-align:top">
	<td>
		<table border="0" cellpadding="0" cellspacing="0">
			<thead>
				<tr class="header">
					<th colspan="2"> </th>
				</tr>
			</thead>
			<tbody>
				<form action="/..." method="post" enctype="multipart/form-data">
						<input type="hidden" name="data[id]" value="<?=$this->scroller['id'];?>" /> 

						<tr>
						<td align="right" valign="top"><label for="data[title]">Title: </label></td>
						<td align="left" valign="top"><input type="text" value="<?=$this->scroller['title'];?>" name="data[title]" /></td>
					</tr>
						<tr>
						<td align="right" valign="top"><label for="data[url]">URL: </label></td>
						<td align="left" valign="top"><input type="text" value="<?=$this->scroller['url'];?>" name="data[url]" /></td>
					</tr> 
					<div id="foo">
					<tr id=tr1 style="visibility:visible; position:relative;">
						<td align="right" valign="top"><label>Image:</label> </td>
						<td align="left" valign="top"> <img src="/images/scroller/thumb_<?=$this->scroller['link'];?>" /> </td>
					</tr>
					</div>
					<tr>
						<td> </td>
						<td><a  href="#" id="hide" class="hide" onclick="toggle_visibility('foo');" title="Change Image">Change Image</a></td>
					</tr>	
					<tr>
						<td> </td>
						<td><input type="file" name="s_image"  id="s_image" /></td>
					</tr>
					<tr>
						<td align="right" valign="top"><label for="data[status]">Status:</label> </td>
  							<td valign="top"><?=$this->formSelect('data[status]', $this->scroller['status'], array('id'=>'data[status]'), $this->status)?></td>
  						
						</tr> 
					<tr>
						<td colspan="2" align="right"><input type="submit" name="submit" value="save"</td>
					</tr>
				</form>	
			</tbody>
			</table>
	</td>
</tr>
</table>

 

 

Can you show an example of your table code?  I have the feeling it could be failing because of multiple elements with the same id, but would like to be sure.

Link to comment
Share on other sites

I tried:

<div id="foo" style="display:block;">

but it had no effect  :(

 

Ah, okay.  You need to initialize the div's display to 'block'.  Right now, it doesn't have any value explicitly assigned to its display property, so the if-conditional is failing.

 

Also, you need to put quotes around the id of tr1.

Link to comment
Share on other sites

I tried:

<div id="foo" style="display:block;">

but it had no effect  :(

 

Ah, okay.  You need to initialize the div's display to 'block'.  Right now, it doesn't have any value explicitly assigned to its display property, so the if-conditional is failing.

 

Also, you need to put quotes around the id of tr1.

 

Can you show me all of your code?

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.