469,357 Members | 1,914 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,357 developers. It's quick & easy.

Javascript Problem in Firefox

Dear Members,

I am going to create the online form creation in html with javascript, i have a problem with the following code, i got this code from internet, the following script only works in IE but it doesn't work in other browser like (Firefox and Opera), i don't know what's the problem with code. If anybody know the solution let me know...



Expand|Select|Wrap|Line Numbers
  1. <html>
  2.     <head>
  3.         <title>Adding and Removing Rows</title>
  4.         <script language="javascript">
  5.  
  6.             //add a new row to the table
  7.             function addRow()
  8.             {
  9.                 //add a row to the rows collection and get a reference to the newly added row
  10.                 var newRow = document.all("tblGrid").insertRow();
  11.  
  12.                 //add 3 cells (<td>) to the new row and set the innerHTML to contain text boxes
  13.  
  14.                 var oCell = newRow.insertCell();
  15.                 oCell.innerHTML = "<input type='text' name='t1'>";
  16.  
  17.                 oCell = newRow.insertCell();
  18.                 oCell.innerHTML = "<input type='text' name='t2'>";
  19.  
  20.                 oCell = newRow.insertCell();
  21.                 oCell.innerHTML = "<input type='text' name='t3'> &nbsp;&nbsp;<input type='button' value='Delete' onclick='removeRow(this);'/>";            
  22.             }
  23.  
  24.             //deletes the specified row from the table
  25.             function removeRow(src)
  26.             {
  27.                 /* src refers to the input button that was clicked.    
  28.                    to get a reference to the containing <tr> element,
  29.                    get the parent of the parent (in this case case <tr>)
  30.                 */            
  31.                 var oRow = src.parentElement.parentElement;        
  32.  
  33.                 //once the row reference is obtained, delete it passing in its rowIndex            
  34.                 document.all("tblGrid").deleteRow(oRow.rowIndex);        
  35.             }
  36.  
  37.         </script>
  38.     </head>
  39.     <body>
  40.  
  41.         <!-- sample table grid with 3 columns and 4 rows that are presented by default -->
  42.         <table id="tblGrid" style="table-layout:fixed">
  43.             <tr>
  44.                 <td width="150px">Field1</td>
  45.                 <td width="150px">Field2</td>
  46.  
  47.                 <td width="250px">Field3</td>
  48.             </tr>
  49.             <tr>
  50.                 <td><input type="text" name="t1" /></td>
  51.                 <td><input type="text" name="t2" /></td>
  52.                 <td><input type="text" name="t3" /> &nbsp;&nbsp;<input type="button" value="Delete" onclick="removeRow(this);" /></td>
  53.             </tr>
  54.             <tr>
  55.  
  56.                 <td><input type="text" name="t1" /></td>
  57.                 <td><input type="text" name="t2" /></td>
  58.                 <td><input type="text" name="t3" /> &nbsp;&nbsp;<input type="button" value="Delete" onclick="removeRow(this);" /></td>
  59.             </tr>
  60.             <tr>
  61.                 <td><input type="text" name="t1" /></td>
  62.                 <td><input type="text" name="t2" /></td>
  63.                 <td><input type="text" name="t3" /> &nbsp;&nbsp;<input type="button" value="Delete" onclick="removeRow(this);" /></td>
  64.  
  65.             </tr>
  66.             <tr>
  67.                 <td><input type="text" name="t1" /></td>
  68.                 <td><input type="text" name="t2" /></td>
  69.                 <td><input type="text" name="t3" /> &nbsp;&nbsp;<input type="button" value="Delete" onclick="removeRow(this);" /></td>
  70.             </tr>
  71.         </table>
  72.         <hr>
  73.  
  74.         <input type="button" value="Add Row" onclick="addRow();" />
  75.         <hr>
  76.  
  77.     </body>
  78.  
  79.  
  80. </html>


Thanks in Advance,



V. Prasath
Apr 6 '09 #1
2 1761
dmjpro
2,476 2GB
"document.all" does not work in Mozilla.
Always try yo follow the W3C specification for JavaScript.
That would be working in all browsers ;)
Apr 6 '09 #2
acoder
16,027 Expert Mod 8TB
In case you're wondering what the standard method is, it's document.getElementById() with a valid ID.
Apr 6 '09 #3

Post your reply

Sign in to post your reply or Sign up for a free account.

Similar topics

12 posts views Thread by Howard Kaikow | last post: by
5 posts views Thread by LRW | last post: by
13 posts views Thread by John Smith | last post: by
8 posts views Thread by chrisdude911 | last post: by
4 posts views Thread by lmarceglia | last post: by
7 posts views Thread by Coder | last post: by
11 posts views Thread by minnesotti | last post: by
8 posts views Thread by Matt Kruse | last post: by
16 posts views Thread by Eric | last post: by
reply views Thread by zhoujie | last post: by
reply views Thread by suresh191 | last post: by
1 post views Thread by Marylou17 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.