Home/ Questions/Q 7588301
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-30T19:53:21+00:00

I create 2 PHP pages (test.php, getcompany.php) in test.php page, I have a row

  • 0

I create 2 PHP pages (test.php, getcompany.php)

in test.php page, I have a row with order details. check working DEMO here :

[DEMO] : http://delta-adv.com/test.php

As you saw in demo in first row when I select product it populate company name from database but when I click add row button then in 2nd row when I select product it change company name in top row only. below is the code for test.php

<html>
<head>
<script language="javascript" type="text/javascript">
function getXMLHTTP() { //function to return the xml http object
        var xmlhttp=false;  
        try{
            xmlhttp=new XMLHttpRequest();
        }
        catch(e)    {       
            try{            
                xmlhttp= new ActiveXObject("Microsoft.XMLHTTP");
            }
            catch(e){
                try{
                xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
                }
                catch(e1){
                    xmlhttp=false;
                }
            }
        }

        return xmlhttp;
    }

    function getcompany(productId) {        

        var strURL="getcompany.php?product="+productId;
        var req = getXMLHTTP();

        if (req) {

            req.onreadystatechange = function() {
                if (req.readyState == 4) {
                    // only if "OK"
                    if (req.status == 200) {                        
                        document.getElementById('companydiv').innerHTML=req.responseText;                       
                    } else {
                        alert("There was a problem while using XMLHTTP:\n" + req.statusText);
                    }
                }               
            }           
            req.open("GET", strURL, true);
            req.send(null);
        }       
    }
</script>
<script type="text/javascript">
function tot(elem) {
var d=document.getElementById("total").value;
var total=Number(d); 
var e=document.getElementById("vat5").value;
var vat5=Number(e); 
var f=document.getElementById("vat12_5").value;
var vat12_5=Number(f); 
var g=document.getElementById("cash_discount").value;
var cash_discount=Number(g); 

var h=(total+vat5+vat12_5)-cash_discount;
document.getElementById("grand_total").value = h;
}

var total = 0;
function getValues() {
var qty = 0;
var rate = 0;
var obj = document.getElementsByTagName("input");
      for(var i=0; i<obj.length; i++){
         if(obj[i].name == "qty[]"){var qty = obj[i].value;}
         if(obj[i].name == "rate[]"){var rate = obj[i].value;}
         if(obj[i].name == "amt[]"){
                if(qty > 0 && rate > 0){obj[i].value = qty*rate;total+=(obj[i].value*1);}
                        else{obj[i].value = 0;total+=(obj[i].value*1);}
                }
             }
        document.getElementById("total").value = total*1;
        total=0;
}

</script>
<script type="text/javascript">
function addRow(tableID) {
            var table = document.getElementById(tableID);
            var rowCount = table.rows.length;
            var row = table.insertRow(rowCount);
            var colCount = table.rows[0].cells.length;
            for(var i=0; i<colCount; i++) {
                var newcell = row.insertCell(i);
                newcell.innerHTML = table.rows[0].cells[i].innerHTML;
                //alert(newcell.childNodes);
                switch(newcell.childNodes[0].type) {
                    case "text":
                            newcell.childNodes[0].value = "";
                            break;
                    case "checkbox":
                            newcell.childNodes[0].checked = false;
                            break;
                    case "select-one":
                            newcell.childNodes[0].selectedIndex = 0;
                            break;
                }
            }
        }

                function deleteRow(tableID)
{
            try
                 {
                var table = document.getElementById(tableID);
                var rowCount = table.rows.length;
                    for(var i=0; i<rowCount; i++)
                        {
                        var row = table.rows[i];
                        var chkbox = row.cells[0].childNodes[0];
                        if (null != chkbox && true == chkbox.checked)
                            {
                            if (rowCount <= 1)
                                {
                                alert("Cannot delete all the rows.");
                                break;
                                }
                            table.deleteRow(i);
                            rowCount--;
                            i--;
                            }
                        }
                    } catch(e)
                        {
                        alert(e);
                        }
   getValues();
}
</script>
</head>
<body>
<form name="gr" method="post" action="<?php echo htmlentities($_SERVER['PHP_SELF']); ?>" onSubmit="return validateForm(this)">
<tr>
<td class="forhead" style="white-space:nowrap;">&nbsp;</td>
<table width="70%" align="center" cellpadding="0" cellspacing="0" class="normal-text" border="0">
<tr>
  <td width="32"></td>
  <td width="126">Product</td>
  <td width="149">company</td>
<td width="91" class="forhead" style="white-space:nowrap;">Qty</td>
<td width="100" class="forhead" style="white-space:nowrap;">Unit Price</td>
<td width="87" class="forhead" style="white-space:nowrap;">Total</td>
<td width="28" class="forhead" style="white-space:nowrap;">&nbsp;</td>
<td width="156" class="forhead" style="white-space:nowrap;"><span class="forhead" style="white-space:nowrap;">
  <span class="forhead" style="white-space:nowrap;">
  <input type="button" value="Add Row" onClick="addRow('dataTable')" >
  </span>
  <input type="button" value="Delete Row" onClick="deleteRow('dataTable')" >
</span></td>
</tr>
</table>
<table border="0" id="dataTable" width="70%" align="center" cellpadding="0" cellspacing="0" class="normal-text">
<tr>
<td width="31" class="forhead" style="white-space:nowrap;"><input type="checkbox" name="chk[]"/>&nbsp;</td>
<td class="forhead" style="white-space:nowrap;" width="127">
<select name="product" onChange="getcompany(this.value)">
    <option value="">Select Product</option>
    <option value="1">iphone</option>
    <option value="2">ipad</option>
    <option value="3">Galaxy S2</option>
        </select>
</td>
<td class="forhead" style="white-space:nowrap;" width="148">
<div id="companydiv"><input name="company" value="" /></div>
</td>
<td class="forhead" style="white-space:nowrap;" width="99"><input type="text"  name="qty[]"  onkeyup="getValues()" style="width:80px;" onBlur=""></td>
<td class="forhead" style="white-space:nowrap;" width="100"><input type="text"  name="rate[]" onKeyUp="getValues()" style="width:80px;" value=""></td>
<td class="forhead" style="white-space:nowrap;" width="148"> <input type="text"  name="amt[]" style="width:80px;" 
onKeyUp="getValues()"></td>
<td width="8" align="right" class="forhead" style="white-space:nowrap;">&nbsp;</td>
<td class="forhead" style="white-space:nowrap;" width="108">&nbsp;</td>
</tr>
</table>
<table width="70%" align="center" cellpadding="0" cellspacing="0" class="normal-text" border="0">
<tr>
<td width="169" class="forhead" style="white-space:nowrap;">&nbsp;</td>
<td width="600" class="forhead" style="white-space:nowrap;">&nbsp;</td>
</tr>
<tr>
  <td align="right"><span class="forhead" style="white-space:nowrap;">Gross Total:</span></td>
  <td align="left"><span class="forhead" style="white-space:nowrap;">
    <input type="text"  id="total" name="total[]" style="width:80px;" value="">
  </span></td>
</tr>
<tr>
  <td align="center" colspan="2"><input name="Submit" type="submit" value="Save" style="text-decoration:none"/>
    <input type="reset" value="Cancel" onClick="window.location.href='<?php echo $_SERVER['PHP_SELF'];?>'"></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</form>
</body>
</html>

code for getcompany.php

 <?php 
    $product=intval($_GET['product']);
    $link = mysql_connect('localhost', 'root', ''); //Localhost configuration
    if (!$link) {
        die('Could not connect: ' . mysql_error());
    }
    mysql_select_db('test');
    $query="SELECT * FROM  tbl_company WHERE prod_ID='$product'";
    $result=mysql_query($query);
    $row=mysql_fetch_array($result);
    ?>
    <input name="company" value="<?php echo $row['company_name']; ?>" />
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You don’t need to add special ids.

    1.) First change the id to a class:
    From: <div id="companydiv"><input name="company" value="" /></div>
    To: <div class="companydiv"><input name="company" value="" /></div>

    2.) Change the select onchange parameter to this:
    From: <select name="product" onChange="getcompany(this.value)">
    To: <select name="product" onChange="getcompany(this)">

    3.) Replace your getcompany function with:

    function getcompany(element) {      // the parametername has changed   

    var strURL="getcompany.php?product="+element.value; // this line has changed
    var req = getXMLHTTP();

    if (req) {

        req.onreadystatechange = function() {
            if (req.readyState == 4) {
                // only if "OK"
                if (req.status == 200) {   
                    // last changes here:
                    element.parentNode.parentNode.getElementsByClassName('companydiv')[0].innerHTML=req.responseText;                       
                } else {
                    alert("There was a problem while using XMLHTTP:\n" + req.statusText);
                }
            }               
        }           
        req.open("GET", strURL, true);
        req.send(null);
    }       
}
    • 0