469,307 Members | 1,926 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

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

dynamic table using javascript

45
hi everyone,

i am creating dynamic row in a table using javascript its working fine and now i want to create more than 1 table using javascript which is dynamic its also working fine but when i am taking the value of each table individually thats i am not able to get any value. if i get the value of table then its not taking properly.

let me explain the whole scenario...

i want to add product specification . it may vary in number of specification.i.e. i may be 2 or 10 or 30 etc.for each specification i have to add properties it is possible only using dynamic rows.like suppose if i have 5 specification and i have to add properties for each specification then i will use dynamic row creation. And now i am able to do this till now after that i am not able to take the value of all the text fields in a single text field by comma(,) separated.

how will i do this please help me out its urgent...
Apr 8 '09 #1
3 4674
acoder
16,027 Expert Mod 8TB
Please post your code, so we can see where the problem might lie.
Apr 8 '09 #2
tokcy
45
Expand|Select|Wrap|Line Numbers
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <html>
  3.      <head>
  4.           <title>Dymanic Row</title>
  5. <script language="Javascript" type="text/javascript">
  6.      function addRow(str)
  7.      {
  8.           var tbl = document.getElementById('mySampleTable'+str);
  9.           var lastRow = tbl.rows.length;
  10.           var iteration = lastRow;
  11.           var row = tbl.insertRow(lastRow);
  12.           var cellLeft = row.insertCell(0);
  13.           var textNode = document.createTextNode(iteration);
  14.           //cellLeft.appendChild(textNode);
  15.           var cellRight = row.insertCell(1);
  16.           var el = document.createElement('input');
  17.           el.type = 'text';
  18.           el.name = 'txtRow' + iteration;
  19.           el.id = 'txtRow' + iteration;
  20.           el.size = 40;
  21.           cellRight.appendChild(el);
  22.           //el.setAttribute("onBlur","setvalue(this);");
  23.      }
  24.  
  25.      function removeRow(str1)
  26.      {
  27.           var tbl = document.getElementById('mySampleTable'+str1);
  28.           var lastRow = tbl.rows.length;
  29.           if (lastRow > 2) tbl.deleteRow(lastRow - 1);
  30.      }
  31.  
  32. function setvalue(str2)
  33. {
  34.     alert(str2);
  35.     var i=0;
  36.     var idstr="txtRow" + str2;
  37.     //alert('item' + str2);
  38.     document.getElementById('item' + str2).value="";
  39.     while(document.getElementById(idstr))
  40.     {
  41.     document.getElementById('item' + str2).value=document.getElementById('item' + str2).value + ',' + document.getElementById(idstr).value;
  42.     idstr='txtRow' + str2;
  43.     str2++;
  44.     }
  45. }
  46. </script>
  47.      </head>
  48.      <body leftmargin="0" topmargin="0">
  49.           <form action="#" name="frm" method="post">
  50.               <? 
  51.               $i=1;
  52.               for($i=1;$i<=5;$i++)
  53.                 {
  54.               ?>
  55.                <table align="center" width = "75%">
  56.                      <tr>
  57.                        <td align = "center">
  58.                  <input type="text" name="item<?=$i?>" id="item<?=$i?>" value="<?=$i?>" size="40" />
  59.                  <table border="1" id="mySampleTable<?=$i?>">
  60.                                      <tr>
  61.                                         <td>&nbsp;</td>
  62.                                         <td>
  63.                                              Specification
  64.                                         </td>
  65.                                         <td>&nbsp;</td>
  66.                                    </tr>
  67.  
  68.                                    <tr>
  69.                                         <td>&nbsp;</td>
  70.                                         <td>
  71.                                              <input type="text" name="txtRow<?=$i?>" id="txtRow<?=$i?>" size="40" value="<?=$i?>" onBlur="setvalue(this);" /></td>
  72.                                         <td>&nbsp;</td>
  73.                                    </tr>
  74.                               </table>
  75.                               <input type="button" name="add" id="add" value="Add" onClick="addRow('<?=$i?>'); setvalue(<?=$i?>);" />
  76.                               <input type="button" value="Remove" onClick="removeRow('<?=$i?>');" />
  77.                               <input type="submit" value="Submit" onClick="setvalue(<?=$i?>);" />
  78.                          </td>
  79.                     </tr>
  80.                </table>
  81.                <?
  82.                }
  83.                ?>
  84.           </form>
  85.      </body>
  86. </html>
  87.  
Apr 8 '09 #3
acoder
16,027 Expert Mod 8TB
You're passing 'this' to setvalue when you probably mean to pass a string.
Apr 8 '09 #4

Post your reply

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

Similar topics

18 posts views Thread by chimalus | last post: by
1 post views Thread by nsvmani | last post: by
9 posts views Thread by pbd22 | last post: by
reply views Thread by suresh191 | last post: by
reply views Thread by harlem98 | last post: by
1 post views Thread by Geralt96 | last post: by
reply views Thread by harlem98 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.