bman21
asked on
getElementById javascript with IE7
i have a javascript that displays a button next to a variable in website. The website updates constantly and after awhile, my button disappears altogether or takes it a very long time to load. i googled the heck out of this and found many references to a problem on how IE handles the getElementByID function that i currently am using.
The error that my google search explained to me was that the error occurs because IE7 doesn't handle the getElementByID function properly. instead of searching the id field, IE7 also searches another field, and if either are the same or doesn't exist, the code breaks.
Attached is a portion of the code that i have the getElementById implemented. Also, within the code i have the workaround that everyone seems to mention after the google search. Right now it is commented out because it does not work (the buttons do not display).
This is an urgent matter and any help is greatly appreciated. attached is the snippet
The error that my google search explained to me was that the error occurs because IE7 doesn't handle the getElementByID function properly. instead of searching the id field, IE7 also searches another field, and if either are the same or doesn't exist, the code breaks.
Attached is a portion of the code that i have the getElementById implemented. Also, within the code i have the workaround that everyone seems to mention after the google search. Right now it is commented out because it does not work (the buttons do not display).
This is an urgent matter and any help is greatly appreciated. attached is the snippet
for ( pai in idsAry )
{
sid = idsAry[pai];
// button = "<input type=button style='border: 0px;' id='button" + sid + "' value='+' border='0' onclick=checkPriors('" + sid + "')>";
button = "<img src='images/report-icon.gif' id='button" + sid + "' border='0' onclick=checkPriors('" + sid + "')>";
/*if (/msie/i.test(navigator.userAgent)) //only overide IE
{
//alert("IT WORKED");
document.nativeGetElementById = document.getElementByID;
document.getElementById = function(id)
{
var elem = document.nativeGetElementById(id);
if(elem)
{
//make sure that it is a valid match on id
if(elem.attributes['id'].value == id)
{
return elem;
//alert("it worked");
}
else
{
//otherwise find the correct element
for(var i=1;i<document.all[id].length;i++)
{
if(document.all[id][i].id == id)
{
return document.all[id][i];
}
}
}
}
return null;
};
}*/
document.getElementById(sid).innerHTML = button;//debugger breaks here after the page refreshes
Last Comment
Lukasz Chmielewski
as I see it, you are trying to numberate the buttons with button1, button2 etc., still, I can't imagine the whole page, would you send a complete or almost a complete page ? I'd say that the .innerHTML property is the issue here, because for what I know this is the problem with IE
ASKER CERTIFIED SOLUTION
THIS SOLUTION IS ONLY AVAILABLE TO MEMBERS.
View this solution by signing up for a free trial.
Members can start a 7-Day free trial and enjoy unlimited access to the platform.
ASKER
ok, changed that, now i get a stack overflow error
here is all of the javascript that is involved with this button.
here is all of the javascript that is involved with this button.
<script type="text/javascript">
var httpRequest;
var index;
var mapsign;
var studyIsReady = true;
var maxpriors = 0;
//bug workaround for document.getElementById and getAttributes (doesn't work in ie)
//overrides the IE getElementById with nativeGetElementById and then searches the document for the correct id
/*function nativeGetElementById(sid)
{
if (/msie/i.test(navigator.userAgent)) //only overide IE
{
//alert("IT WORKED");
document.nativeGetElementById = document.getElementByID;
document.getElementById = function(id)
{
var elem = document.nativeGetElementById(id);
if(elem)
{
//make sure that it is a valid match on sid
if(elem.attributes['id'].value == id)
{
return elem;
//alert("it worked");
}
else
{
//otherwise find the correct element
for(var i=1;i<document.all[id].length;i++)
{
if(document.all[id][i].id == id)
{
return document.all[id][i];
}
}
}
}
//alert("it didn't work");
}
}
}
*/
function sendStudies(studiesStr) {
maxpriors++
if (maxpriors < 50) {
if (typeof XMLHttpRequest != "undefined"){
httpRequest = new XMLHttpRequest();
} else if (window.ActiveXObject){
httpRequest = new ActiveXObject("Microsoft.XMLHTTP");
}
httpRequest.onreadystatechange = receivePriors;
httpRequest.open('GET', 'https://MYWEBSITE/add_prior_buttons.php?studies=' + studiesStr, true); //also debugger broke here
httpRequest.send(null);
}
}
function receivePriors() {
if (httpRequest.readyState == 4){
if (httpRequest.status == 200){
var idsStr = httpRequest.responseText;
// Split retrieved string into an array.
var idsAry = new Array();
idsAry = idsStr.split("-");
// displayPriors(idsAry);
// Then loop through the array to insert a button into the corresponding span id.
var pai = 0;
for ( pai in idsAry )
{
sid = idsAry[pai];
// button = "<input type=button style='border: 0px;' id='button" + sid + "' value='+' border='0' onclick=checkPriors('" + sid + "')>";
button = "<img src='images/report-icon.gif' id='button" + sid + "' border='0' onclick=checkPriors('" + sid + "')>";
/*if (/msie/i.test(navigator.userAgent)) //only overide IE
{
//alert("IT WORKED");
document.nativeGetElementById = document.getElementById;
document.getElementById = function(id)
{
var elem = document.nativeGetElementById(id);
if(elem)
{
//make sure that it is a valid match on id
if(elem.attributes['id'].value == id)
{
return elem;
//alert("it worked");
}
else
{
//otherwise find the correct element
for(var i=1;i<document.all[id].length;i++)
{
if(document.all[id][i].id == id)
{
return document.all[id][i];
}
}
}
}
return null;
};
}*/
document.getElementById(sid).innerHTML = button;//debugger broke here
}
} else {
// alert('There was a 200 problem');
}
} else {
// alert('There was a 4 problem');
return 0;
}
}
/*************************************************************************
This function inserts a button (value='+') into the HTML of the
corresponding span id.
**************************************************************************/
function displayPriors(priorsArray) {
var pai = 0;
for ( pai in priorsArray )
{
button = "<input type=button id='button" + priorsArray[pai] + "' value='+' onclick=checkPriors('" + priorsArray[pai] + "')>";
//if(/msie/i.test (native.userAgent))
document.getElementById(priorsArray[pai]).innerHTML = button;
}
}
function checkPriors(studyid){
// set the row index
index = studyid;
row = document.getElementById("row" + studyid);
// if the study is expanded, set button value to '-'
if (row.style.display == "none"){
row.style.display = "";
document.getElementById('button' + studyid).value = "-";
} else {
// else set it to '+'
row.style.display = "none";
document.getElementById('button' + studyid).value = "+";
}
if (typeof XMLHttpRequest != "undefined"){
httpRequest = new XMLHttpRequest();
} else if (window.ActiveXObject){
httpRequest = new ActiveXObject("Microsoft.XMLHTTP");
}
// httpRequest.overrideMimeType('text/xml');
httpRequest.open('GET', 'https://MYWEBSITE/prior_reports.php?studyId=' + studyid, true);
httpRequest.onreadystatechange = callback;
httpRequest.send(null);
}
function callback(){
if (httpRequest.readyState == 4){
if (httpRequest.status == 200){
document.getElementById("priors"+index).innerHTML = httpRequest.responseText;
} else {
// alert('There was a 200 problem');
}
} else {
// alert('There was a 4 problem');
}
}
ASKER
ok, i think i solved the problem with the help of ludofulop. i placed the workaround at the beginning of the javascript. it removed the stack overflow problem.
i am going to leave this open for a couple of days to be sure that this solves my problem.
i am going to leave this open for a couple of days to be sure that this solves my problem.
PHP
PHP is a widely-used server-side scripting language especially suited for web development, powering tens of millions of sites from Facebook to personal WordPress blogs. PHP is often paired with the MySQL relational database, but includes support for most other mainstream databases. By utilizing different Server APIs, PHP can work on many different web servers as a server-side scripting language.
125K
Questions
--
Followers
--
Top Experts
Get a personalized solution from industry experts
TRUSTED BY
