Changing iframe src with Javascript causing the whole page to refresh

Viewed 95

I've used stack overflow for years and have never ran into an issue that I didn't find a resolution to. I'm completely stuck however, so I actually signed up to post this questions.

I have an index page with a few different iframes. The content of each iframe can sometimes dynamically change what page is displayed in one of the other iframes. All of my javascript is at the index level, so my calls within the iframe are to the parent, to change the src of the other iframe.

I've been getting feedback from some users that when they click on a link/button which changes one of the other iframes, it resets the entire page like they hit the refresh button and were starting over from the start of the page. I have never been able to reproduce this issue myself, but the users that have it get it consistently. I've done remote sessions with them, and they're not doing anything different, but are experiencing the page refresh behavior. I'm using Chrome, and the users having the issue are using the same build of Chrome, but I've had one of them say when they use Firefox the issue doesn't happen.

Here's an example of the frames on the index page

<iframe id="frmStopTime" src="stop_times_blank.html"></iframe>
<iframe id="frmTimetable" src="timetable.html"></iframe>

Here's the call on the timetable page.

<a href="#" onclick="return parent.openStopTime('18399922', '5');event.preventDefault();"> 5:36</a>

And here's the javascript function.

function openStopTime(whichTrip, whichStopTimePoint) {

document.getElementById("frmStopTime").contentWindow.location.assign("../../../" + strEnvironment + "/stop_times/" + whichTrip + ".xml")
changeFocus('StopTime');

return false;
}

I've tried changing the timetable page tag to span instead of a href, I've added in the preventDefault() that I didn't have to begin with. I tried adding the return and return false in the function, because I found places that said that may be an issue. My javascript was originally document.getElementById("frmStopTime").src = parent.strEnvironment + "/stop_times/" + tripID + ".xml"; which I changed just because I didn't know what else to try. None of that made and difference one way or the other.

All of these variations didn't make a difference for me, and it has always worked consistently, loading the correct pages at the correct time without resetting the page.

If it happens to make any different, most of the content in the frames getting loaded is xml data with xsl stylesheets.

I'm not a professional developer and my code may not be in line with current standards or best practices, but it works as far as I can tell. Any thoughts would be appreciated. Thanks.

0 Answers
Related