Connecting Tech Pros Worldwide Help | Site Map
bytes > topic > javascript > answers

php and ajax dynamically created select box onchange event

Newbie
  
Join Date: Mar 2007
Posts: 10
#1: Sep 5 '07
i want to basically take some information for the product and let the user
enter the the material required to make this product

1.first page test.php
which takes product code and displays prodcut anme have used
ajax to avoid refreshing of page this works fine
2.now i have created one row with
checkbox|select box|text|text|text|text|
where in the select box values are fetched from table here also i have used ajax for getting the m_name automatically withput refreshi works fine (onchange event)
3.after that i have given a add rows button on which rows are added dynamically
with the same like static row i have added
now i wantto use the same function i have used for static select box for avoiding refreshing here how do i pass the onchange event here
and after pressing submit button the dynamic rows created disappears
can anybody help me wot is wrong with this

how do i pass dynamic elements values from the rows to the php along with the static row values
my code is as follows

Expand|Select|Wrap|Line Numbers
  1. test.php
  2.  
  3.  
  4. <?
  5.  
  6. include("../include/connection.php");
  7. if($_GET)
  8. {
  9. $p_cde=$_GET['p_cde'];
  10.  
  11. $cnt = count($_GET['m_cde'])+1;
  12.       for ($idx=0;$idx<=$cnt;$idx++) {
  13.           $m_cde= $_GET['m_cde'][$idx] ;
  14.           $m_name=$_GET['m_name'][$idx]; 
  15.           $um=$_GET['um'][$idx]; 
  16.           $qty=$_GET['qty'][$idx]; 
  17.           $overages=$_GET['overages'][$idx]; 
  18.      }
  19. }
  20. ?>
  21. <html>
  22. <head>
  23. <script src="test.js" ></script>
  24. </head>
  25. <body><form name="material" method="GET"> 
  26. <table id="tbl" border="1">
  27. <tr><td>
  28. <select name="p_cde" id="p_cde" onChange="showCode(this.value);">
  29.    <? 
  30.    $sqlpr = "select * from fgmaster order by p_cde ";
  31.     $db_query=$DB_site->query($sqlpr);
  32.     while($rspr=$DB_site->fetch_array($db_query)){
  33.                $combopr=$combopr."<option value='".$rspr['p_cde']."'";
  34.             if ($rspr['p_cde']==strtoupper($p_cde)){
  35.                 $combopr=$combopr."selected";
  36.                 }
  37.             $combopr=$combopr.">".$rspr['p_cde']."-".$rspr['p_name']."</option>\n";
  38.        }
  39.        echo $combopr;   
  40.  
  41.        ?> 
  42. </select>
  43. </td>
  44.  
  45. <td><input type="text" name="p_name" id="p_name" value=""></td>
  46. <td><input type="text" name="p_pckunit" id="p_pckunit" value=""></td></tr>
  47. <?
  48.     $sqlmaterial="select * from materialmaster order by m_cde";
  49.     $db_query_material=$DB_site->query($sqlmaterial);
  50.     while($rsmaterial=$DB_site->fetch_array($db_query_material)){
  51.                 $option_vals[]=$rsmaterial['m_cde']."-".$rsmaterial['m_name'];
  52. }
  53.     ?>
  54. <script>
  55. select_opt = new Array();
  56. <?
  57. for($i=0;$i<count($option_vals);$i++){
  58.     ?>
  59.         select_opt[<?= $i ?>] = '<?= $option_vals[$i] ?>';
  60.     <?
  61. }
  62. ?>
  63. </SCRIPT>
  64.  
  65. <tr bgcolor="#CCCCCC" bordercolor="#FFCCFF"> 
  66.       <th>&nbsp;&nbsp; </th>
  67.  
  68.       <th >Code</th>
  69.  
  70.       <th>Material description</th>
  71.  
  72.       <th>um</th>
  73.  
  74.       <th>qty</th>
  75.  
  76.       <th>overages</th>
  77.  
  78.  
  79.  
  80.     </tr>
  81.  
  82.  
  83.      <tr> 
  84.      <td><input type="checkbox" name="chk" id="chk"></td>
  85.         <td><select name='m_cde' id='m_cde' onChange='showmcode(this.value);'>
  86.            <? 
  87.            $sqlmr = "select * from materialmaster order by m_cde ";
  88.         $db_query_mr=$DB_site->query($sqlmr);
  89.         while($rsmr=$DB_site->fetch_array($db_query_mr)){
  90.                $combomr=$combomr."<option value='".$rsmr['m_cde']."'";
  91.             if ($rsmr['m_cde']==strtoupper($m_cde)){
  92.                 $combomr=$combomr."selected";
  93.                 }
  94.         $combomr=$combomr.">".$rsmr['m_cde']."-".$rsmr['m_name']."</option>\n";
  95.            }
  96.            echo $combomr;   
  97.         ?> 
  98.     </select></td>
  99.     </td><td><input type="text" name='m_name' id='m_name' value=""></td>
  100.     <td><input type="text" name='um' id='um' value=""></td>
  101.     <td><input type="text" name='qty' id='qty' value=""></td>
  102.     <td><input type="text" name='overages' id='overages' value=""></td>
  103.     </tr> 
  104.  
  105.     <tbody>
  106. </tbody>
  107. </table>
  108. <DIV>
  109. <input type ="button" value="Add Row" onclick="add_rows(document.getElementById('tbl'));">
  110. </div>
  111. <DIV><input type ="submit" value="Submit" name="myfields"></DIV>
  112. </form>
  113. </body>
  114. </html>
Expand|Select|Wrap|Line Numbers
  1. test.js
  2. ------------
  3. // JavaScript Document
  4. var xmlHttp;
  5. function showCode(str)
  6. { 
  7. xmlHttp=GetXmlHttpObject();   //Calls on the GetXmlHttpObject function to create an XMLHTTP object 
  8. if (xmlHttp==null)
  9.  {
  10.  alert ("Browser does not support HTTP Request");
  11.  return;
  12.  }
  13. var url="testget.php"; //Defines the url (filename) to send to the server 
  14. url=url+"?p_cde="+str;  //Adds a parameter (q) to the url with the content of the dropdown box 
  15. url=url+"&sid="+Math.random(); //Adds a random number to prevent the server from using a cached file 
  16. xmlHttp.onreadystatechange=stateChanged ; //Call stateChanged when a change is triggered 
  17. xmlHttp.open("GET",url,true);  //Opens the XMLHTTP object with the given url. 
  18. xmlHttp.send(null);                //Sends an HTTP request to the server 
  19. alert(url);
  20. }
  21. function showmcode(str)
  22. { 
  23. xmlHttp=GetXmlHttpObject();   //Calls on the GetXmlHttpObject function to create an XMLHTTP object 
  24. alert(str);
  25. if (xmlHttp==null)
  26.  {
  27.  alert ("Browser does not support HTTP Request");
  28.  return;
  29.  }
  30. var url="testget.php"; //Defines the url (filename) to send to the server 
  31. url=url+"?m_cde="+str;  //Adds a parameter (q) to the url with the content of the dropdown box 
  32. url=url+"&sid="+Math.random(); //Adds a random number to prevent the server from using a cached file 
  33. xmlHttp.onreadystatechange=stateChanged1 ; //Call stateChanged when a change is triggered 
  34. xmlHttp.open("GET",url,true);  //Opens the XMLHTTP object with the given url. 
  35. xmlHttp.send(null);                //Sends an HTTP request to the server 
  36. alert(url);
  37. }
  38. function stateChanged() 
  39. { 
  40. if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
  41.  { 
  42.  
  43.    var ar=xmlHttp.responseText.split("|");
  44.  
  45.    document.getElementById("p_name").value=ar[0] ;
  46.    document.getElementById("p_pckunit").value=ar[1] ;
  47.  
  48.  
  49.  } 
  50. }
  51.  
  52. function stateChanged1() 
  53. { 
  54. if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
  55.  { 
  56.    var ar=xmlHttp.responseText.split("|");
  57.    document.getElementById("m_name").value=ar[0] ;
  58.    document.getElementById("um").value=ar[1] ;
  59.   } 
  60. }
  61. function GetXmlHttpObject()
  62. {
  63. var xmlHttp=null;
  64. try
  65.  {
  66.  // Firefox, Opera 8.0+, Safari
  67.  xmlHttp=new XMLHttpRequest();
  68.  }
  69. catch (e)
  70.  {
  71.  //Internet Explorer
  72.  try
  73.   {
  74.   xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
  75.   }
  76.  catch (e)
  77.   {
  78.   xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
  79.   }
  80.  }
  81. return xmlHttp;
  82. }
  83.  
  84.  
  85.  
  86. //FUNCTION FOR DYNAMIC ROW
  87.  
  88. j=0;
  89. function add_rows(obj){
  90.  
  91.     //tabObj = document.createElement("table");
  92.     //tbodyObj = document.createElement("tbody");
  93.  
  94.     tabCols = new init_table();
  95.     trObj = document.createElement("tr")
  96.     col_names = new Array("chk","m_cde","m_name","um","qty","overages"); 
  97.     for(i=0;i<tabCols.length;i++){
  98.         tdObj = document.createElement("td");
  99.         /*
  100.          if(create_object(tabCols[i])=="select")
  101.          {
  102.          mselect=create_object(tabCols[i],col_names[i]+'['+j+']')
  103.          mselect.onChange=showmcode(col_names[i]+'['+j+']');
  104.          tdObj.appendChild(mselect));
  105.          }*/
  106.  
  107.         tdObj.appendChild(create_object(tabCols[i],col_names[i]+'['+j+']'));
  108.  
  109.         //added on 04/09/2007 for onchage event on select box
  110. /*        if(tabCols[i]=="select"){
  111.         alert("hi");
  112.             col_names[i]+'['+j+']'="fieldevent('"+fieldname+"')";
  113.             var showmcode=new Function(col_names[i]+'['+j+']'.onchange);
  114.             if(col_names[i]+'['+j+']'.addEventListener){
  115.             col_names[i]+'['+j+']'.addEventListener('change',showmcode,false);
  116.             else if(col_names[i]+'['+j+']'.attachEvent){
  117.             col_names[i]+'['+j+']'.attachEvent('onchange',showmcode);}
  118.             }
  119.         /* this is a sample
  120.         sfield.onchange = "fieldevent('" + fieldname + "')"; 
  121.             var onChangeHandler = new Function(sfield.onchange); 
  122.             if (sfield.addEventListener) { 
  123.             sfield.addEventListener('change', onChangeHandler, false ); 
  124.             } else if (sfield.attachEvent) { 
  125.             sfield.attachEvent('onchange', onChangeHandler); 
  126.             } 
  127.             */
  128.             trObj.appendChild(tdObj);
  129.  
  130.     }
  131.     obj.firstChild.appendChild(trObj);
  132.  
  133.  
  134. j++;
  135.  
  136. }
  137.  
  138. function fieldevent(fname){ 
  139.  
  140. alert (fname); 
  141. } 
  142.  
  143.  
  144.  
  145. function init_table(){
  146.     tableProp = new Array();
  147.  
  148.     tableProp[0] = "checkbox";
  149.     tableProp[1] = "select"; //m_cde
  150.     tableProp[2] = "text"; //m_name
  151.     tableProp[3] = "text"; //um
  152.     tableProp[4] = "text"; //qty
  153.     tableProp[5] = "text"; //overages    
  154.     //tableProp[6] = "checkbox";
  155.  
  156.     return tableProp;
  157. }
  158.  
  159. function create_object(objType,nm){
  160.     if(objType == 'select'){
  161.         return getSelectBoxDOM(select_opt,nm);
  162.     }    
  163.  
  164.     obj = document.createElement("input");
  165.     obj.setAttribute("type",objType);
  166.     obj.setAttribute("name",nm);
  167.  
  168.  
  169.     return obj; 
  170. }
  171.  
  172. function getSelectBoxDOM(options,nm) {
  173.             selectBox =document.createElement('select');
  174.            for (x=0; x < options.length; x++) {
  175.                 optionItem =document.createElement('option');
  176.                    optionItem.appendChild(document.createTextNode(options[x]));
  177.                 selectBox.appendChild(optionItem);
  178.  
  179.  
  180.             }
  181.             selectBox.setAttribute("name",nm);
  182.  
  183.  
  184.            return selectBox;
  185.  
  186. }


Expand|Select|Wrap|Line Numbers
  1. testget.php
  2. ----------------
  3.  
  4.  
  5. <?php
  6. if($_GET)
  7. {
  8.  
  9. $p_cde=$_GET['p_cde']; 
  10.  
  11.  
  12. $con = mysql_connect('localhost', 'localhost', '');  //PHP opens a connection to a MySQL server 
  13.  
  14. if (!$con)
  15.  {
  16.  die('Could not connect: ' . mysql_error());
  17.  }
  18. mysql_select_db("erpmfg", $con);
  19. $sql="select * from fgmaster where p_cde = '".$p_cde."'";
  20. $result = mysql_query($sql);
  21. while($row = mysql_fetch_array($result)){
  22. $p_name=$row['p_name'];
  23. $p_pckunit=$row['p_pckunit'];
  24. echo $p_name."|".$p_pckunit;
  25. }
  26. }
  27.  
  28. if ($_GET)
  29. {
  30.  
  31. $m_cde=$_GET['m_cde'];
  32.  
  33. $sqlmr="select * from materialmaster where m_cde = '".$m_cde."'";
  34. $result1 = mysql_query($sqlmr);
  35.  
  36. while($row = mysql_fetch_array($result1)){
  37. $m_name=$row['m_name'];
  38. $um=$row['um'];
  39.  
  40. echo $m_name."|".$um;
  41. }
  42. } 
  43.  
  44.  
  45. mysql_close($con);
  46. ?>
dmjpro's Avatar
Lives Here
  
Join Date: Jan 2007
Location: India (West-Bengal)
Posts: 2,451
#2: Sep 5 '07

re: php and ajax dynamically created select box onchange event

Please use Code tags then it will be easy to Solve your Problem.

Kind regards,
Dmjpro.
acoder's Avatar
Site Moderator
  
Join Date: Nov 2006
Location: UK
Posts: 14,581
#3: Sep 5 '07

re: php and ajax dynamically created select box onchange event

Leena, welcome to TSDN!

Did you know that you can specify languages in the code tags, e.g. [code=javascript]...[/code.] (remove the dot).
acoder's Avatar
Site Moderator
  
Join Date: Nov 2006
Location: UK
Posts: 14,581
#4: Sep 5 '07

re: php and ajax dynamically created select box onchange event

Give your dynamically created elements ids. For your select, add the onchange when you create the element.
Newbie
  
Join Date: Mar 2007
Posts: 10
#5: Sep 5 '07

re: php and ajax dynamically created select box onchange event

Expand|Select|Wrap|Line Numbers
  1. j=1;
  2. function add_rows(obj){
  3.  
  4.      tabCols = new init_table();
  5.      trObj = document.createElement("tr")
  6.      col_names = new Array("chk","m_cde","m_name","um","qty","overages"); 
  7.      for(i=0;i<tabCols.length;i++){
  8.         tdObj = document.createElement("td");
  9.         /*         if(create_object(tabCols[i])=="select")
  10.          {
  11.          mselect=create_object(tabCols[i],col_names[i]+'['+j+']')
  12.          mselect.onChange=showmcode(col_names[i]+'['+j+']');
  13.          tdObj.appendChild(mselect));
  14.          }*/
  15.  
  16.         tdObj.appendChild(create_object(tabCols[i],col_names[i]+'['+j+']'));


i was trying the above commented line in add_rows function while creating a select box using createElement function for onchange where am i going wrong
acoder's Avatar
Site Moderator
  
Join Date: Nov 2006
Location: UK
Posts: 14,581
#6: Sep 5 '07

re: php and ajax dynamically created select box onchange event

Quote:

Originally Posted by Leena P

i was trying the above commented line in add_rows function while creating a select box using createElement function for onchange where am i going wrong

Use onchange (lower case "c").
Newbie
  
Join Date: Mar 2007
Posts: 10
#7: Sep 5 '07

re: php and ajax dynamically created select box onchange event

i tried that but then my add rows button does not create new row some error
but if comment that part then it works
how to give onchage event when the select box is created

Expand|Select|Wrap|Line Numbers
  1. function getSelectBoxDOM(options,nm) {
  2.             selectBox =document.createElement('select');
  3.            for (x=0; x < options.length; x++) {
  4.                 optionItem =document.createElement('option');
  5.                    optionItem.appendChild(document.createTextNode(options[x]));
  6.                 selectBox.appendChild(optionItem);
  7.  
  8.  
  9.             }
  10.             selectBox.setAttribute("name",nm);
  11.             selectBox.setAttribute("id",nm);
  12. //after this say selectBox.onchange=showmcode(nm.value)........ ??????
  13. where nm is the name of the selectbox
  14.            return selectBox;
  15. }           
  16.  
i tried this bt giving error property not supported

thanks.
acoder's Avatar
Site Moderator
  
Join Date: Nov 2006
Location: UK
Posts: 14,581
#8: Sep 5 '07

re: php and ajax dynamically created select box onchange event

Please use code tags when posting code. Thanks!

You need to assign a function object to the onchange, not the result of the function. See this article.

Try:
Expand|Select|Wrap|Line Numbers
  1. selectBox.onchange = function() {
  2.  showmcode(selectBox.value);
  3. }
Newbie
  
Join Date: Mar 2007
Posts: 10
#9: Sep 5 '07

re: php and ajax dynamically created select box onchange event

i tried that but then my add rows button does not create new row some error
but if comment that part then it works
how to give onchage event when the select box is created

Expand|Select|Wrap|Line Numbers
  1. function getSelectBoxDOM(options,nm) {
  2.             selectBox =document.createElement('select');
  3.            for (x=0; x < options.length; x++) {
  4.                 optionItem =document.createElement('option');
  5.                    optionItem.appendChild(document.createTextNode(options[x]));
  6.                 selectBox.appendChild(optionItem);
  7.  
  8.  
  9.             }
  10.             selectBox.setAttribute("name",nm);
  11.             selectBox.setAttribute("id",nm);
  12. //after this say selectBox.onchange=showmcode(nm.value)........ ??????
  13. where nm is the name of the selectbox
  14.            return selectBox;
  15. }           
  16.  
  17.  
i tried this bt giving error property not supported

thanks.
acoder's Avatar
Site Moderator
  
Join Date: Nov 2006
Location: UK
Posts: 14,581
#10: Sep 5 '07

re: php and ajax dynamically created select box onchange event

Make sure you use code tags. This is the final friendly request. The last post seems like a repeat of your previous comment.
Newbie
  
Join Date: Mar 2007
Posts: 10
#11: Sep 5 '07

re: php and ajax dynamically created select box onchange event

Expand|Select|Wrap|Line Numbers
  1. selectBox.onchange = function() {
  2.  showmcode(selectBox.value);
  3. }

i did this but now it add a record but once i select value from dynamically added select box the value of m_name is not shown in corresponding text box there and my static rows um and m_name disappears which i had selected and where onchange event it had executed ajax script to display m_name and um


thanks
acoder's Avatar
Site Moderator
  
Join Date: Nov 2006
Location: UK
Posts: 14,581
#12: Sep 5 '07

re: php and ajax dynamically created select box onchange event

Try
Expand|Select|Wrap|Line Numbers
  1. selectBox.onchange = function() {
  2.  showmcode(this.value);
  3. }
Don't forget to set the values of the option elements.
Newbie
  
Join Date: Mar 2007
Posts: 10
#13: Sep 6 '07

re: php and ajax dynamically created select box onchange event

same problem i changes it to this.value

i'm setting the options in the getselectbox function
and then actual database values are passed in test.php program

can't understand what is wrong with my code



thanks
markrawlingson's Avatar
Moderator
  
Join Date: Aug 2007
Location: Bowmanville, Ontario
Posts: 329
#14: Sep 6 '07

re: php and ajax dynamically created select box onchange event

Try..

Expand|Select|Wrap|Line Numbers
  1. selectBox.onchange = function() {
  2.  showmcode(this.options[this.selectedIndex].value);
  3. }
  4.  
acoder's Avatar
Site Moderator
  
Join Date: Nov 2006
Location: UK
Posts: 14,581
#15: Sep 6 '07

re: php and ajax dynamically created select box onchange event

Quote:

Originally Posted by Leena P

same problem i changes it to this.value

i'm setting the options in the getselectbox function
and then actual database values are passed in test.php program

can't understand what is wrong with my code

You're not setting the value of the options. Set the value by using .value or setAttribute, e.g.
Expand|Select|Wrap|Line Numbers
  1. optionItem.value = 'someval';
Newbie
  
Join Date: Mar 2007
Posts: 10
#16: Sep 6 '07

re: php and ajax dynamically created select box onchange event

i writing a code to create select box

Expand|Select|Wrap|Line Numbers
  1. function getSelectBoxDOM(options,nm) {
  2.             selectBox =document.createElement('select');
  3.            for (x=0; x < options.length; x++) {
  4.                 optionItem =document.createElement('option');
  5.                    optionItem.appendChild(document.createTextNode(options[x]));
  6.                 selectBox.appendChild(optionItem);
  7.            }
  8.             selectBox.setAttribute("name",nm);
  9.             selectBox.setAttribute("id",nm);
  10.             s=new function(){}
  11.             selectBox.onchange =new function() {
  12.                 showmcode(this.options[this.selectedIndex].value);
  13.             }
  14.            return selectBox;
  15. }
which is called here

Expand|Select|Wrap|Line Numbers
  1.  function create_object(objType,nm){
  2.     if(objType == 'select'){
  3.         return getSelectBoxDOM(select_opt,nm);
  4.         //select_opt.onchange = function() {
  5.             //    showmcode(this.options[this.selectedIndex].value);
  6.         //    }
  7.     }    
  8.  
  9.     obj = document.createElement("input");
  10.     obj.setAttribute("type",objType);
  11.     obj.setAttribute("name",nm);
  12.     obj.setAttribute("id",nm);
  13.  
  14.     return obj; 
  15. }
and when i'm adding rows the function create_object is called

Expand|Select|Wrap|Line Numbers
  1. function add_rows(obj){
  2.  
  3.     //tabObj = document.createElement("table");
  4.     //tbodyObj = document.createElement("tbody");
  5.  
  6.     tabCols = new init_table();
  7.     trObj = document.createElement("tr")
  8.     col_names = new Array("chk","m_cde","m_name","um","qty","overages"); 
  9.     for(i=0;i<tabCols.length;i++){
  10.         tdObj = document.createElement("td");
  11.         tdObj.appendChild(create_object(tabCols[i],col_names[i]+'['+j+']'));\
  12.         tdObj.appendChild(op.value);
  13.         trObj.appendChild(tdObj);
  14.     }
  15.     obj.firstChild.appendChild(trObj);
  16. j++;
  17. }
and in test.php i'm assigning values to options
so when the form is loaded select options are filled with database values



[PHP]<?
$sqlmaterial="select * from materialmaster order by m_cde";
$db_query_material=$DB_site->query($sqlmaterial);
while($rsmaterial=$DB_site->fetch_array($db_query_material)){
$option_vals[]=$rsmaterial['m_cde']."-".$rsmaterial['m_name'];
}
?>
<script>
select_opt = new Array();
<?
for($i=0;$i<count($option_vals);$i++){
?>
select_opt[<?= $i ?>] = '<?= $option_vals[$i] ?>';
<?
}
?>[/PHP]



now how and where to writea code to give onchange event to the select box
i tried create_object function where objtype="select" and where getselectbox function is called but same error.
i also tried in addrow function just after creating object ..
i'm new to ajax and dom
so please tell me how do do this
i have a static row where the same m_cde select box is there where this function is working prooerly
but when i do it for dynamic rows if i alert then it shows [object]
and with static rows it shows the allthe object created with id and all
also how do i pass the m_cde as arry to the url inthe showmcode function for rows .

thanks
Newbie
  
Join Date: Mar 2007
Posts: 10
#17: Sep 6 '07

re: php and ajax dynamically created select box onchange event

but i'm assigning values to select box in the main program test.php from the database to the javascript array variable
and creating the select boxes in the test.js
so is it because of that it is creating problem?
acoder's Avatar
Site Moderator
  
Join Date: Nov 2006
Location: UK
Posts: 14,581
#18: Sep 7 '07

re: php and ajax dynamically created select box onchange event

Change line 5 in getSelectBoxDOM to:
Expand|Select|Wrap|Line Numbers
  1. optionItem.text = options[x];
  2. optionItem.value = options[x];
You could use setAttribute if you want instead, e.g.
Expand|Select|Wrap|Line Numbers
  1. optionItem.setAttribute("value",options[x]);
Newbie
  
Join Date: Mar 2007
Posts: 10
#19: Sep 9 '07

re: php and ajax dynamically created select box onchange event

Thanks
my onchange event function works in select option
but then it gives me error in mozilla

Error: uncaught exception: [Exception... "Node cannot be inserted at the specified point in the hierarchy" code: "3" nsresult: "0x80530003 (NS_ERROR_DOM_HIERARCHY_REQUEST_ERR)"

this is in the add_rows function
when i try to append

Expand|Select|Wrap|Line Numbers
  1. tdObj.appendChild(create_object(tabCols[i],col_names[i]+'['+j+']'));
  2. trObj.appendChild(tdObj); }
  3. obj.firstChild.appendChild(trObj); //this line the above error occurs
  4.  
am i not setting the attributes in order the way it should for the objects created
and no rows are added dynamically
but in IE 6 it works and even the new rows are inserted
but the value of m_name is not assigned to the corresponding text box in then newly created row like it is shown in static row
how do i pass it in the test1.js in the statechaged1 corresponding to that row cell created
gits's Avatar
Moderator
  
Join Date: May 2007
Location: Munich, Germany
Posts: 4,126
#20: Sep 9 '07

re: php and ajax dynamically created select box onchange event

hi ...

please have a look at the correct usage of the code-tags:

[CODE=javascript] code goes here [/code]

kind regards
Newbie
  
Join Date: Mar 2007
Posts: 10
#21: Oct 9 '07

re: php and ajax dynamically created select box onchange event

[quote=Leena P]i want to basically take some information for the product and let the user
enter the the material required to make this product
acoder's Avatar
Site Moderator
  
Join Date: Nov 2006
Location: UK
Posts: 14,581
#22: Oct 9 '07

re: php and ajax dynamically created select box onchange event

Quote:

Originally Posted by Leena P

Thanks
my onchange event function works in select option
but then it gives me error in mozilla

Error: uncaught exception: [Exception... "Node cannot be inserted at the specified point in the hierarchy" code: "3" nsresult: "0x80530003 (NS_ERROR_DOM_HIERARCHY_REQUEST_ERR)"

this is in the add_rows function
when i try to append

Expand|Select|Wrap|Line Numbers
  1. tdObj.appendChild(create_object(tabCols[i],col_names[i]+'['+j+']'));
  2. trObj.appendChild(tdObj); }
  3. obj.firstChild.appendChild(trObj); //this line the above error occurs
  4.  

You're trying to append to a whitespace node. Don't use firstChild. Use a tbody and append to that instead.
Reply

« previous question | next question »

Similar JavaScript / Ajax / DHTML bytes

/bytes/development

/bytes/it

/bytes/about

We are a network of experts and professionals in IT and software development that help one another with answers to tough questions and share insights. Get the best answers to your questions from over 226,295 network members.

dev questions:
algorithms | asp | asp.net | c/c++ | coldfusion | c# | flash | html/css | java | javascript |
mobile dev | .net | perl | php | python | ruby | software dev | vb.net | visual basic | xml
it questions:
access | apache | careers | db2 | iis | macosx | mysql | networking | oracle | postgresql | sql server | unix | windows

About Bytes | Copyright 1995-2009 BYTES. All rights Reserved