Fire javascript/jquery in jQuery dialog after .load
<p>I have a jQuery dialog which I fire from a list of items in a jTemplate:</p>

<pre><code>&lt;a href="#" class="view-map" id="{$T.Address.AddressCity.Lat}|{$T.Address.AddressCity.Lon}"&gt;&lt;img src="/images/iconography/tiny-map.png" width="16" height="16" alt="See this address on a map..." title="See this address on a map..."&gt;&lt;/img&gt;&lt;/a&gt;
</code></pre>

<p>jQuery:</p>

<pre><code>$('.view-map').live('click', function () {
            $('#map')
                .data('id', $(this).attr('id'))
                .dialog('open')

            ;
            return false;
        });

        $('#map').dialog({
            autoOpen: false,
            resizeable: false,
            position: 'top',
            modal: true,
            width: 650,
            open: function() {
                var location =  $(this).data('id').split('|');
                $(this).load('/components/google/map.aspx?lat=' + location[0] + '&amp;lon=' + location[1]);
            },
            buttons: {
                'Ok': function () {
                    $(this).dialog('close');
                }
            }
        });
</code></pre>

<p>When the <code>map.aspx</code> page loads, I want the following javascript to fire (so I can get the map from Google):</p>

<pre><code>function initialize() {
            var myOptions = {
                zoom: 9,
                disableDefaultUI: true,
                center: new google.maps.LatLng(&lt;%=Lat%&gt;, &lt;%=Lon%&gt;),
                mapTypeId: google.maps.MapTypeId.ROADMAP
            };
            var map = new google.maps.Map(document.getElementById('x-map-placeholder'), myOptions);
            document.getElementById('x-map-loader').style.display = 'none';
        }

        function loadScript() {
            alert("I'm away!");
            var script = document.createElement('script');
            script.type = 'text/javascript';
            script.src = 'http://maps.googleapis.com/maps/api/js?sensor=false&amp;callback=initialize';
            document.body.appendChild(script);
        }
        function toLower(s) {
            return s.toLowerCase();
        }
        function toFixed(n) {
            return n.toFixed(0);
        }

        window.onload = loadScript;
</code></pre>

<p>Obviously it doesn't and I think this is because how the dialog is called - I understand that calling a dialog isn't <code>window.onload</code>ing and therefore won't fire the <code>loadScript</code>, but I'm not sure what to do to get it to fire.... </p>

<p>Can anyone help? :)</p>

<p>Help is appreciated.</p>
