transfering multiple div between php pages

[alexia_net]

Hi. I have created a form with 4 textboxes and one listbox. What I want to do is for every record which i select from the list to populate the boxes with information from a MySql database. I have managed to do this for one textbox, but i have a problem when doing the same for more then one textbox (DIV). Below is the code I am using to identify the div and write the info in the right place, for only one text box.

THE FORM

//the form also contains the function getInfoNetwork
    <td width="<?php echo $col3; ?>"><label>Address:
        <div id="NetAddress"><input type="text" name="txtNetAddress" /></div>
</label></td>

    <td width="<?php echo $col3; ?>"><label>Address:
        <div id="NetMask"><input type="text" name="txtNetMask" /></div>
</label></td>

THE AJAX FUNCTION

function getInfoNetwork(networkID){

    var strURL = "findNetworkInfo.php?networkID="+networkID;
        var req = getXMLHTTP();
    if (req){
        req.onreadystatechange = function(){
            if(req.readyState == 4){
                if(req.status == 200){
                    document.getElementById('NetAddress').innerHTML = req.responseText;                 
                }else{
                    alert("There was a problem while using XMLHTTP:\n"+req.statusText);
                }
            }
        }
        req.open("GET", strURL, true);
        req.send(null);
    }
}

PLACING THE INFO IN THE RIGHT DIV

//THIS CODE IS IN THE findNetworkInfo.PHP FILE, ALSO THE FUNCTION getInfoNetwork
<input type="text" id="NetAddress" name="txtNetAddress" value="ccccc"/>

What should i do to transfer the DIV NetMask along? Thank you!

[Airshow]

Presumably the two items of data (NetAddress and NetMask) form a pair which can be delivered together in one hit on findNetworkInfo.PHP?

If so, first modify findNetworkInfo.PHP to return the two data items concatenated with a unique separator:

99.65.165.25^255.255.255.0

There's no need for HTML tags because the data can be inserted into the DOM elements that are already in place on the page.

We could address the input elements by their names but let's give them ids (and remove the div wrappers):

<tr>
<td width="<?php echo $col3; ?>"><label>IP Address:</label><br />
<input type="text" id="txtNetAddress" name="txtNetAddress" />
</td>
<td width="<?php echo $col3; ?>"><label>Subnet Mask:</label><br />
<input type="text" id="txtNetMask" name="txtNetMask" />
</td>
</tr>

Last, modify the javascript to separate the concatenated values and insert them into the document :

function getInfoNetwork(networkID) {
	var strURL = "findNetworkInfo.php?networkID=" + networkID;
	var req = getXMLHTTP();
	if (req){
		req.onreadystatechange = function() {
			if(req.readyState == 4) {
				if(req.status == 200) {
					var values = req.responseText.split('^')//here we split the concatenated string at the separator character, and put the two parts into an array ( same as php's explode() )
					try {
						if(values.length < 1 || values[0] === '') { throw({}); }//do more extensive validation here as required
						document.getElementById('txtNetAddress').value = values[0];
					}
					catch(e) {
						document.getElementById('txtNetAddress').value = 'error';
					}
					try {
						if(values.length < 2 || values[1] === '') { throw({}); }//do more extensive validation here as required
						document.getElementById('txtNetMask').value = values[1];
					}
					catch(e) {
						document.getElementById('txtNetMask').value = 'error';
					}
				}
				else {
					alert("There was a problem while using XMLHTTP:\n"+req.statusText);
				}
			}
		}
		req.open("GET", strURL, true);
		req.send(null);
	}
}

There's even a bit of safety in there to handle errors in the delivered data.

Airshow

[alexia_net]

Hi. Thank you for your answer. The two text boxes are going to be populated after executing some tasks in the findNetworkInfo.php. So my dilemma is how to combine php and html to write the values in the right place. I will try you solution as well, but i am interested in the other way too. If could make some light for me in this case it would be nice. Thank you!

[alexia_net]

Your solution works nicely. Thank you. Its more elegant also. Thanks.