Dialog gets wrong data after ajax load

Dialog gets wrong data after ajax load


Hello.
I use jQuery 1.3.2 and jQuery UI 1.7.2 (also same on jQuery UI 1.8a1)
After ajax loading dialog reads previous data.
Below is the simplified code to reproduce problem.
Click Message AAA ----> alerts AAA (OK)
Click Show Message ----> alerts AAA (OK)
Click Load via Ajax ----> reloads element (OK)
Click Message AAA ----> alerts AAA (OK)
Click Show Message ----> alerts undefined (PROBLEM)
Close Dialog
Click Message CCC ----> alerts CCC (OK)
Click Show Message ----> alerts AAA (PROBLEM: It's previous message)
When you reload via ajax it gets 2nd previous, 3rd previous etc. I
think dialog isn't garbage collected when element is deleted from DOM.
Do I miss something or is it a bug?
****************************************
Page HTML code:
****************************************
<html>
<head>
    <title>Untitled</title>
    <script type="text/javascript" src="/jquery.js"></script>
    <script type="text/javascript" src="/jquery-ui.js"></script>
<link rel="stylesheet" href="jquery-ui.css" type="text/css"
media="screen, projection" />
</head>
<body>
<div id="dynamic"></div>
<script type="text/javascript">
$(function() { $('#dynamic').load( '/ajax.html' ) } );
</script>
</body>
</html>
****************************************
ajax.html code:
****************************************
<div id="Container">
    <div id="Dialog">This is dialog</div>
    <script type="text/javascript">
        $(function() {
            $("#Dialog").dialog({
                 bgiframe: true,
resizable: false,
width:400,
height:50,
modal: true,
autoOpen: false,
title: 'Title',
buttons: {
                    "Show Message": function() {
                        alert('Message from dialog:' + $('#Dialog').data('message'));
                        $(this).dialog('close');
                    },
                    "Load via Ajax": function() {
                        $(function() { $('#Container').parent().load( '/
ajax.html' ) } );
                        $(this).dialog('close');
                    }
                }
            });
        });
    </script>
<div onclick="$('#Dialog').data('message', 'AAA'); alert('Message
onclick: ' + $('#Dialog').data('message')); $('#Dialog').dialog
('open')">AAA</div>
<div onclick="$('#Dialog').data('message', 'BBB'); alert('Message
onclick: ' + $('#Dialog').data('message')); $('#Dialog').dialog
('open')">BBB</div>
<div onclick="$('#Dialog').data('message', 'CCC'); alert('Message
onclick: ' + $('#Dialog').data('message')); $('#Dialog').dialog
('open')">CCC</div>
</div>