Dynamic Table table javascript not working - javascript

<script>
function showUser(str) {
if (str == "") {
document.getElementById("txtHint").innerHTML = "";
return;
} else {
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else {
// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET","destination_get.php?q="+str,true);
xmlhttp.send();
}
}
</script>
TypeError: document.getElementById(...) is null document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
Please help

The error contains all the information you need here:
TypeError: document.getElementById(...) is null document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
Your JS thinks there is no element with id="txtHint" in the document, therefore document.getElementById returns null, and null is not an object with the property innerHTML.

Related

Get string from javascript on the same page

Problem is that i have dynamic changing script for mysql query
<script>
function showUser(str) {
if (str == "") {
document.getElementById("txtHint").innerHTML = "";
return;
} else {
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else {
// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("txtHint").innerHTML = this.responseText;
}
};
xmlhttp.open("GET","getuser.php?q="+str,true);
xmlhttp.send();
}
}
</script>
I need to get str from this code to php.
from the html point of view i get string from
<select name="users" onchange="showUser(this.value)">
adn in the other file getuser.php I have
$q = $_GET['q'];
$sql="SELECT * FROM articles WHERE type = '".$q."'";
The biggest problem is that i put onchange this parameters so i can get values to my page without refreshing it. But now i cant get value from combobox to php.
How can i do this ???
Thanks in advance

Uncaught TypeError: Cannot read property 'getElementsByTagName' of null on webhost

I cant seem to find the problem. when i run this in Xampp it works fine, but when i transfer it to hostgator it doesnt work it says in the console
Uncaught TypeError: Cannot read property 'getElementsByTagName' of null
here's the code:
function LoadAsOwner()
{
Filename = document.getElementById('filename').value;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("GET",Filename, false);
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
LAO(xmlhttp);
}
};
xmlhttp.send();
}
function LAO(xml)
{
var x="", i="", xmlDoc="", txt="",i="";
xmlDoc = xml.responseXML;
x = xmlDoc.getElementsByTagName("question");
Qlength=x.length;
QCset=new Array(Qlength);
for(i=0;i<x.length;i++)
{
QCset[i]={
Answer: x[i].getElementsByTagName("term")[0].childNodes[0].nodeValue
,Question: x[i].getElementsByTagName("detail")[0].childNodes[0].nodeValue
,Selected: 0
};
}
selectQuestions();
}

Cannot click on the content which is loaded through ajax function

Currently, I cannot load the second content using ajax. Actually, I have loaded the first content using ajax. In order to go to the second content, i need to call the ajax function but after i click to load the second content using ajax it does not work. I have checked my code, its working fine if i directly call the second ajax function, unless i call the first ajax function after that the ajax is not working again. Are there any ways to solve this problem.
This is the first ajax code:
function showMusic(str) {
if (str == "") {
document.getElementById("albums").innerHTML = "";
return;
} else {
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else {
// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("albums").innerHTML = xmlhttp.responseText;
}
};
xmlhttp.open("GET","getAlbums.php?q="+str,true);
xmlhttp.send();
}
}
The above function works. The above function is at another php file
This is the second ajax code:
$(document).ready(function(){
function showArtistDetails(str) {
if (str == "") {
alert("hi");
document.getElementById("artist").innerHTML = "";
return;
} else {
if (window.XMLHttpRequest) {
alert("hi1");
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else {
alert("hi2");
// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("artist").innerHTML = xmlhttp.responseText;
alert("hi3");
}
};
xmlhttp.open("GET","getArtist.php?title="+str,true);
alert("hi4");
xmlhttp.send();
alert("hi5");
}
}
$("#clickme").click(showArtistDetails);
});
This is the php code which is at another php file:
echo "<td id=\"clickme\">" . $row['CDTitle'] . "</td>";
I have been trying to solve this for the past 2 days but i am unable to solve it. Some are saying its a bug. But i really i dont know what causes this problem. Thanks in advance.

Javascript Ajax not working in IE 10

I have two files
1. page.cfm
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else {
// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
// document.getElementById("myDiv").innerHTML = xmlhttp.responseText;
console.log("Response : " + xmlhttp.responseText);
console.log("State : " + xmlhttp.readyState);
if (xmlhttp.responseText.trim() == "true" || xmlhttp.responseText == "true ") {
console.log("done");
return false;
}
}
}
xmlhttp.open("GET", "ajx_page.cfm?ProdID="+ProdID, true);
xmlhttp.send();
2. ajx_page.cfm
// logic condition, printing true or false
So, the problem, Ajax is working good in all browsers except Internet Explorer IE.
xmlhttp.responseText is always false, where as in other browers, its perfect.
Any clue why its happening with IE.
FYI.
I tried all modes of IE.

Using Ajax to change the inner content of a div

I am a beginner at Ajax, and I have this html code that is meant to change the inner content of a div by using xmlhttprequest to request different html addresses and put their contents in a div. What am I doing wrong? Here is the code:
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<script type="text/javascript">
var xmlhttp= null;
if(window.XMLHttpRequest){
xmlhttp = new XMLHttpRequest();
}else{
alert("You must be using a different browser.");
}
function makeRequest(serverPage,objID){
var obj = document.getElementById(objID);
xmlhttp.open("GET",serverPage);
xmlhttp.onreadystatechange = function(){
if(xmlhttp.readyState == 4 && xmlhttp.status == 100){
obj.innerHTML = xmlhttp.responseText;
}
}
xmlhttp.send(null);
}
</script>
</head>
<body onload="makeRequest ('content1.html','hw')">
<div align="center">
<h1>My Webpage</h1>
Page1 | Page2 | Page3 | Page4
<div id = "hw"></div>
</body>
Generally, this looks OK to me.
However the xmlhttp.status == 100 check looks suspicious.
100 is an unusual HTTP status code. Typically web servers return 200 ("OK") on a successful request.
Try replacing the status == 100 check with status == 200.
For reference,please see: http://www.w3.org/Protocols/rfc2616/rfc2616-sec10.html
change xmlhttp.status == 100 to xmlhttp.status == 200 check if this resolves your issue
and if you are try to run the page in IE try to add this line
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
Test for xmlhttp.status == 200 instead of 100.
http://www.w3schools.com/ajax/ajax_xmlhttprequest_onreadystatechange.asp
I guess it should be:
function makeRequest(serverPage,objID){
xmlhttp.open("GET",serverPage);
xmlhttp.onreadystatechange = function(){
if(xmlhttp.readyState == 4 && xmlhttp.status == 200){
document.getElementById(objID).innerHTML = xmlhttp.responseText;
}
}
xmlhttp.send(null);
}
function AjaxGet(url,helm)
{
if (xmlhttp == null)
{ if (window.XMLHttpRequest) // code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
else // code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function()
{ if (xmlhttp.readyState==4)
{ if ( (xmlhttp.status==200) || (xmlhttp.status==304) )
{ document.getElementById(helm).innerHTML = xmlhttp.responseText; }
else { document.getElementById(helm).innerHTML = xmlhttp.status + " " +xmlhttp.statusText; }
}
}
xmlhttp.open("GET",url,true);
xmlhttp.send();
}

Categories

Resources