AJAX fails only inside JQuery dialog box

December 30th, 2012 |

Author: Sudhir Tiwari

How it works

I have a page called displayRecord.php which is loaded inside a
JQuery dialog box. The dialog box is created inside editTicket.php
Basically the displayRecord.php allows a user to add a username &
ref id and via AJAX $.post it updates the DB and retrieves the
number of record in the respective table.
The retrieve counter step is also meant to occur on page load so
that not only is it displayed when the user adds the username &
password but when the page loads for the first time.

What’s failing to work

Step 3 above fails when the displayRecord.php page is inside the JQuery dialog (or atleast thats what I’ve discovered). If I go to the URL it displays the counter on load. Step 2 still works inside the dialog.

JQuery dialog box call from editTicket.php:

<script type="text/javascript">

var dlg = '';
$(document).ready(function() { 

     dlg=$('#ticketDetails').dialog({
        title: 'TICKET DETAILS',
        resizable: false,
        autoOpen:false,
        modal: true,
        show:'fade',
        hide: 'fade',
        buttons:{ "Close": function() { dlg.dialog("close"); } },
        close: function(e, i) { dlg.hide(); },
        width: 1300   
     });


    $('a.view').click(

        function(e) 
            {    
                dlg.load('displayRecord.php?id='+this.id, function(){ 
                dlg.dialog('open');

            });

        });
});

calling the showCount function on load:

<?php if (@$data['escalate'] == "No"){ ?>
        <body onLoad="showCount()">
<?php } else{ ?>
        <body>
    <?php } ?>

showCount function:

function showCount(){

    var ticket_id = <?php echo $data['id']; ?>

    $.post('escalationCount.php',{post_ticket_id:ticket_id}, 
    function(data) {
    $('#escalationCount').html(data);
    });
}

As state before the on page load function doesn’t appear to be firing inside the JQuery dialog box.

I’m struggling at this point to identify the source of the problem. Some help please, Thanks.