Problem in MOZILLA in SHOW/HIDE table ROWS

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
eshban
Forum Contributor
Posts: 184
Joined: Mon Sep 05, 2005 1:38 am

Problem in MOZILLA in SHOW/HIDE table ROWS

Post by eshban »

Hi, I have just write a code which show/hide rows. But it cannot runs well in MOZILLA browser.

Just run it in MOZILLA and click on the two radio button again and again, you can see that it loose its formatting. second row of table will be pushed towards right.

Please help in this regard.

here is my code

Code: Select all

<!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=iso-8859-1" />
<title>Untitled Document</title>
</head>

Code: Select all

<script>
function hidetable_second()
{
//		    document.getElementById('web_pg_name_caption').style.display = 'inline';		    				
		    document.getElementById('newrow_2').style.display = 'none';	 	    	
			document.getElementById('newrow_3').style.display = 'none';	
			document.getElementById('myfile2').style.display = 'none';	 	    	
			document.getElementById('firstrow').style.display = 'block';		
			
 }  
  
  
   function hiderow(){
      
    document.getElementById('newrow_2').style.display = 'none';	 	    	
    document.getElementById('myfile2').style.display = 'none';	
	
	document.getElementById('firstrow').style.display = 'none';		
	
  }  
  
    
  
  function hiderow_oneway()
  {
    document.getElementById('newrow_2').style.display = 'block';	 	    	
    document.getElementById('newrow_3').style.display = 'block';	 	    	
    document.getElementById('myfile2').style.display = 'block';	 	    	
  }
</script>

Code: Select all

<body onload="hiderow()">

<table width="799px"border="2" cellspacing="0" cellpadding="0" align="center">
	<tr>
		<td colspan="2" align="center" width="799px" valign="top">
		 <input name="radiobutton" type="radio" value="roundtrip"  onClick="hidetable_second()"> Create New Page	
		 <input name="radiobutton" type="radio" value="oneway" onClick="hiderow_oneway()">Update Existing Page			
	  </td>
   </tr>
   
   <TR id="firstrow">
	  <TD width="399px" valign="top">WebPage Name:	  
	  <input name="webpageName" type="text" value="mypage" id="web_pg_name_caption"></TD>
	  <TD id="new_t" width="400px" valign="top">WebPage Title:
	  <input name="webpageTitle" type="text" value="mypage_title" id="web_pg_name_title"></TD>
	  </TR>
	  
	  
	  <tr>
	      <td id="newrow_2" width="399px" valign="top">WebPage Path:&nbsp;&nbsp;</td>
	  	  <td id="newrow_3"  width="400px" valign="top"><input type="file" name="myfile2" id="myfile2"></td>
    </tr>
</table>	
   
</body>
</html>
User avatar
kendall
Forum Regular
Posts: 852
Joined: Tue Jul 30, 2002 10:21 am
Location: Trinidad, West Indies
Contact:

Post by kendall »

there is a style called display:table-row

you will need to do a browser test cause IE doesnt accept it
Post Reply