Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Internet Explorer css styles break after postback from referring php page

I thought I'd throw this out there just to see if anybody has experienced this issue and knows a likely cause/fix off the top of their heads.

I have a PHP page that loads a table of data (built in PHP) with an EDIT link that gets echoed out on each record. The link takes you to an edit page with a user ID and record ID added as parameters to the URL in the edit page. Once the edits are complete and the user submits the changes, they are taken back to the page that showed the data table of records. Everything works successfully except that when they're returned back to the referring page, the DIVs are now all shoved over to the left instead of nicely centered as they were when the page was first loaded. Also, it's evident that some of the other styles are lost in the return trip as well. This ONLY happens in IE (using IE9), and not in FF or Chrome.

I've used Fiddler and the W3C validator to try and narrow down the problem, but my gut is telling me it's either an issue with how IE caches things, or it's a goofy PHP issue posting stuff back into the page before the styles are applied.

Any thoughts??

Thanks!


SOLVED:

Thanks to GolezTrol for the initial advice that led me in the right direction!

I took a closer look at the HTML and found the answer right at the top of the document.

The way this works is when PageA.php loaded, the HTML and styles loaded fine and the page had no errors. When you clicked an EDIT link in the data table, it took you to PageB.php where the info could be edited and submitted back to the database, at which point you were redirected back to PageA.php to see the updated table. When PageA.php loaded again, the page was wrecked and my DIVs were pushed over to the left border, and some styles were lost.

The error was occurring due to a javascript alert that posts when coming back from the referring PageB that lets you know the database was updated. The PHP script was injecting that alert into the document before the DOCTYPE declaration and the rest of the HTML, therefore blowing up my page. To fix it, I just replaced the initial alert with a true/false variable, and then placed the PHP injected alert inside the body of the document. All is good now!

Firefox and Chrome handled the error, but IE9 is much harder on bad programmers. :-)

Thanks for all of the quick responses and advice!

like image 512
gtr1971 Avatar asked Nov 13 '22 12:11

gtr1971


1 Answers

Thanks to GolezTrol for the initial advice that led me in the right direction!

I took a closer look at the HTML and found the answer right at the top of the document.

The way this works is when PageA.php loaded, the HTML and styles loaded fine and the page had no errors. When you clicked an EDIT link in the data table, it took you to PageB.php where the info could be edited and submitted back to the database, at which point you were redirected back to PageA.php to see the updated table. When PageA.php loaded again, the page was wrecked and my DIVs were pushed over to the left border, and some styles were lost.

The error was occurring due to a javascript alert that posts when coming back from the referring PageB that lets you know the database was updated. The PHP script was injecting that alert into the document before the DOCTYPE declaration and the rest of the HTML, therefore blowing up my page. To fix it, I just replaced the initial alert with a true/false variable, and then placed the PHP injected alert inside the body of the document. All is good now!

Firefox and Chrome handled the error, but IE9 is much harder on bad programmers. :-)

Thanks for all of the quick responses and advice!

like image 200
gtr1971 Avatar answered Nov 16 '22 04:11

gtr1971