I am calling a contacts list from a MySQL database using AJAX in PHP page. The data is called correctly, but when I call the PHP page in the browser, I can see the contacts list (data from DB) is being displayed in the top of the page before the meta data. The list should be displayed in the defined DIV, but for some reason it is not. Below is my code:
Ajax Code:
function getUserList(){
var ajaxDisplay = myform.getElementById('displayList'); // HTML Div where data should be displayed
try{ //for Firefox, Chrome, Opera, Safari, IE7+
var activeX = new XMLHttpRequest(); //initializing object
}catch(e){
try{// for IE5 , IE6
var activeX = new ActiveXObject(Msxml2.XMLHTTP);
}
catch(e){
alert("Dude your browser is in Jurassic era!");
}
}
activeX.readystatechange = function{
if(activeX.readyState == 4){
var queryResult = activeX.responseText;
if(!queryResult){
ajaxDisplay.innerHTML = 'Error in populating list';
}else{
ajaxDisplay.innerHTML = queryResult;
}
}
}
activeX.open("GET", "?action=contactsandgroups", true);
activeX.send(null);
}
PHP/HTML code:
<div class="contacts_list_data_contacts" id="displayList"></div>
MySQL Function:
while($row=mysql_fetch_assoc($res_info)){
print '<div class="contacts_headings_01">
<div class="contacts_checkbox_01"><input name="contact_id[]" id="contact_id" type="checkbox" value="'.$row['contact_id'].'" style="margin-top:0px ; margin-left:-3px;" /></div>
<div class="contacts_firstname_01_contacts">'.$row['firstname'].'</div>
<div class="contacts_firstname_01">'.$row['lastname'].'</div>
<div class="contacts_firstname_01">'.$row['company'].'</div>
</div>';
}
When I view the page source, it shows that it prints the data at the top of the page. This happens in Firefox, Chrome, and Internet Explorer.
What I see is, you want this output of
?action=contactsandgroupsto be populated insidediv#displayList. If that is the case, please try the following:Add this in your
<head>part:Try it out and see if it works. If not, send me the HTML Code, where you call the function.