PDA

View Full Version : IE Working, FF Not

sftl99
04-07-2008, 07:11 PM
I have two issues, but I want to deal with the first one which is my code is working in IE but in FF I get an error:
document.getElementById("id") has no properties
Here is test.html
<html>
<body>

<script language="javascript" type="text/javascript">
<!--
//Browser Support Code
function ajaxFunction(){
var ajaxRequest; // The variable that makes Ajax possible!

try{
// Opera 8.0+, Firefox, Safari
ajaxRequest = new XMLHttpRequest();
} catch (e){
// Internet Explorer Browsers
try{
ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try{
ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e){
// Something went wrong
alert("Your browser broke!");
return false;
}
}
}
// Create a function that will receive data sent from the server
ajaxRequest.onreadystatechange = function(){
if(ajaxRequest.readyState == 4){
var ajaxDisplay = document.getElementById('ajaxDiv');
ajaxDisplay.innerHTML = ajaxRequest.responseText;
}
}
var id = document.getElementById('id').value;
var page = document.getElementById('page').value;
var template = document.getElementById('template').value;
var title = document.getElementById('title').value;
var mainimage = document.getElementById('mainimage').value;
var bodyheight = document.getElementById('bodyheight').value;
var header1 = document.getElementById('header1').value;
var content1 = document.getElementById('content1').value;
var header2 = document.getElementById('header2').value;
var content2 = document.getElementById('content2').value;
var header3 = document.getElementById('header3').value;
var content3 = document.getElementById('content3').value;
var queryString = "?id=" + id + "&page=" + page + "&template=" + template + "&title=" + title + "&mainimage=" + mainimage + "&bodyheight=" + bodyheight + "&header1=" + header1 + "&content1=" + content1 + "&header2=" + header2 + "&content2=" + content2 + "&header3=" + header3 + "&content3=" + content3;
ajaxRequest.open("GET", "ajax-test.php" + queryString, true);
ajaxRequest.send(null);
}

//-->
</script>



<form name='myForm'>
<table width="840" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td colspan="5" valign="top">
<input type="hidden" name="admin" value="admin" />
<input type="hidden" name="id" value="2" />
Page Name: <input type="text" name="page" size="20" maxlength="20" /><br />
Template: <input type="text" name="template" size="30" maxlength="30" /><br />
Title: <input type="text" name="title" size="50" maxlength="50" /><br />
Main Image: <input type="text" name="mainimage" size="30" maxlength="30" /><br />
Body Height: <input type="text" name="bodyheight" size="5" maxlength="11" /><br />
&nbsp;<br />
Content:
</td>
</tr>
<tr>
<td width="265" valign="top"><input type="text" name="header1" size="30" maxlength="30" /><br />
<textarea name="content1" cols="45" rows="6"></textarea></td>
<td width="24" valign="top">&nbsp;</td>
<td width="309" valign="top"><input type="text" name="header2" size="30" maxlength="30" /><br />
<textarea name="content2" cols="45" rows="6"></textarea></td>
<td width="31" valign="top">&nbsp;</td>
<td width="211" valign="top"><input type="text" name="header3" size="30" maxlength="30" /><br />
<textarea name="content3" cols="45" rows="6"></textarea></td>
</tr>
<tr>
<td colspan="5" valign="top"><input type='button' onclick='ajaxFunction()' value='Submit Changes' /></td>
</tr>
</table>
</form>
<div id='ajaxDiv'>Your result will display here</div>
</body>
</html>

Any ideas?
A1ien51
04-07-2008, 08:47 PM
well id is probably a perserved word and not the nest thing to use as an id.

second with getElementById you should be using id and not name

IE has a "feature" that if it can not find an element with an id, it looks at the name. So give all of your form elements an id and you should be to use getElementById.

Or you can use document.forms[0].elementName to reference the form element.

Eric
sftl99
04-07-2008, 09:15 PM
well id is probably a perserved word and not the nest thing to use as an id.

second with getElementById you should be using id and not name

IE has a "feature" that if it can not find an element with an id, it looks at the name. So give all of your form elements an id and you should be to use getElementById.

Or you can use document.forms[0].elementName to reference the form element.

Ha! Thanks, Eric. Of all the code my mistake was in the HTML part...I'm an idiot.