title: Access javascript DOM objects in PHP
body: <p>I have a javascript code helping me to dynamically create row after row in a table and to delete a row from that table.
  each row has four cells. cell 1 for instance contains a text zone.
  to differentiate cell1 from row 1 with cell1 from row 2, I rename my cell 1 like that <strong>cell1.name= cell1.name + '_' + row.rowIndex.</strong></p>
  
  <p>I create a submit button so that I could read data entered by a user in the rows of the table and I try to print $_GET. but there is nothing inside. How could I access to my DOM objects in PHP?</p>
  
  <p>I am grateful for your help.</p>
  
  <p>my HTML + PHP code</p>
  
  <pre><code>&lt;body &gt;
  
  &lt;?php
  if (isset($_GET['Enter'])){
      print_r($_GET);
  }
  
  ?&gt;
  
  &lt;h1&gt; Create an Item &lt;/h1&gt;
  &lt;form method="GET" action="func.html"&gt;
      &lt;table align="center" border = "2" cellspacing ="0" cellpadding="3" id="table"&gt; 
          &lt;tr&gt;&lt;td&gt;&lt;b&gt;Functionality Name:&lt;/b&gt;&lt;/td&gt; &lt;td&gt;&lt;b&gt;Description:&lt;/b&gt;&lt;/td&gt; &lt;td&gt;&lt;b&gt;Status:&lt;/b&gt;&lt;/td&gt; &lt;td&gt;&lt;input type="button" Name= "Ajouter" Value="Ajouter" onclick="go()"&gt;&lt;/td&gt;&lt;/tr&gt;
  
      &lt;/table&gt;    
  &lt;input type="submit" name="submit" value="Enter"&gt;
  &lt;/form&gt; 
  &lt;/body&gt;
  </code></pre>
  
  <p>and my Javascript code:</p>
  
  <pre><code>&lt;script&gt;
  
     function getXhr(){
                  var xhr = null; 
                  if(window.XMLHttpRequest) // Firefox and others
                     xhr = new XMLHttpRequest(); 
                  else if(window.ActiveXObject){ // Internet Explorer 
                     try {
                              xhr = new ActiveXObject("Msxml2.XMLHTTP");
                          } catch (e) {
                              xhr = new ActiveXObject("Microsoft.XMLHTTP");
                          }
                  }
                  else { // XMLHttpRequest not supported by your browser
                     alert(" Your browser does not support XMLHTTPRequest objects..."); 
                     xhr = false; 
                  } 
                    return xhr
              }
  
              /**
              *  method called when the user clicks on the button
              */
              function go(){
                  var xhr = getXhr()
                  // We defined what we gonna do with the response
                  xhr.onreadystatechange = function(){
                      // We do somthing once the server's response is OK
                      if(xhr.readyState == 4 &amp;&amp; xhr.status == 200){
                          var body = document.getElementsByTagName("body")[0];
  
                      // Retrieve &lt;table&gt; ID and create a &lt;tbody&gt; element
  
                          var tbl = document.getElementById("table");
                          var tblBody = document.createElement("tbody");
                          var row = document.createElement("tr");
  
                          var cell_1 = document.createElement("td");
                          var cell_2 = document.createElement("td");
                          var cell_3 = document.createElement("td");
                          var cell_4 = document.createElement("td");
  
                      // Create the first cell which is a text zone   
                          var cell1=document.createElement("input");
                          cell1.type="text";
                          cell1.name="fname";
                          cell1.size="20";
                          cell1.maxlength="50";
                          cell_1.appendChild(cell1);
  
                      // Create the second cell which is a text area  
                          var cell2=document.createElement("textarea");
                          cell2.name="fdescription";
                          cell2.rows="2";
                          cell2.cols="30";
                          cell_2.appendChild(cell2);
  
                      // Create the second cell which is a combo box
                          var cell3 = document.createElement("div");
                          cell3.id="rs";
                          cell3.innerHTML=xhr.responseText;
                          cell_3.appendChild(cell3);
  
  
                      // Create the fourth cell which is a button
                          var cell4=document.createElement("input");
                          cell4.type="button";
                          cell4.value="Delete"
                          cell4.onclick=delRow;
                          cell_4.appendChild(cell4);
  
                      // add cells to the row
                          row.appendChild(cell_1);
                          row.appendChild(cell_2);
                          row.appendChild(cell_3);
                          row.appendChild(cell_4);
  
                      // add the row to the end of the table body
                          tblBody.appendChild(row);
  
                      // put the &lt;tbody&gt; in the &lt;table&gt;
                          tbl.appendChild(tblBody);
  
                      //  Rename cells with the row index         
                          var ind=row.rowIndex;
                          var liste_fname = row.getElementsByTagName("input");
                          for(i=0; i &lt; liste_fname.length; i++)
                          {
                             if(liste_fname[i].name == "fname") 
                             {
                                liste_fname[i].name = liste_fname[i].name + "_" + ind; //give fname_1, fname_2, fname_3, ...
  
                             }
                          }
  
                          var fd = row.getElementsByTagName("textarea");
                          fd[0].name = fd[0].name + "_" + ind;
  
                          var cd = row.getElementsByTagName("div");
                          cd[0].id = cd[0].id + "_" + ind;
  
                          var selectname = row.getElementsByTagName("select");
                          selectname[0].name = selectname[0].name + "_" + ind;
  
                      // appends &lt;table&gt; into &lt;body&gt;
                          body.appendChild(tbl);
  
                      // sets the border attribute of tbl to 1;
                          tbl.setAttribute("border", "1");
  
                          }       
                  }
  
                  xhr.open("GET","fstatus.php",true);
                  xhr.send(null);
              }
  function delRow(){
      var i= this.parentNode.parentNode.rowIndex;
      document.getElementById('table').deleteRow(i);
  }
     &lt;/script&gt;
  </code></pre>
  
  <p>Best regards,</p>
  
  <p>Billy</p>