Odd behaviour: I can't use data from .get unless I put it in an alert first!
Argghh, I'm suffering from some odd problem in my code.
I'm trying to grab a chunk of html from a shared folder within the domain, and insert it into a dialog box call that I'm building on-the-fly.
I've got this code running:
- $('.helpfaq').live('click', function () {
- var pageContents = '';
- var message = '<div style="display: block; width: 100%; font-family: arial,helvetica,sans-serif; font-weight: normal; font-size: 9pt; color:#212121;">';
- $.get('shared/faq.htm', function (data) {
- pageContents = data;
- });
- alert(pageContents);
- message += pageContents;
- message += '</div>';
- var title = 'Help';
- $('<div></div>').appendTo($(document.createElement("div"))).html(message).dialog({
- modal: true, title: title, zIndex: 10000, autoOpen: true, width: 600, height: 700, resizable: true, show: "fade", hide: "fade",
- buttons: { Ok: function () { $(this).dialog("close"); } },
- close: function (event, ui) { $(this).remove(); }
- });
- return false;
- });
As that code stands, it works... sort of!
The alert actually shows with no text in it, but when the dialog box shows then the text is there.
If I take the alert out, then the dialog box is empty.
I've tried all sorts of combinations of different variables being assigned before the .get, or not, because me and my colleague suspected there's a problem with the variable scope.
All the example code for .get I've seen so far suggests no special tricks are needed, and yet I can't get it to work :(
What the heck is going on?
Many thanks in advance!