Dialog box on click of table row

Question

I am having a table in html I want that on click of a row a dialog box appears and for updating my database i made an ajax call somewhat like this :

$(document).ready(function() {
$('.myrow').click(function ()
    {
        $("#dialog").dialog({
            autoOpen: false,
            modal: true,
            width: 600,
            height: 300,
                            resizable: false,
            buttons: {
                "Yeah!": function() {
                    $(this).dialog("close");
                },
                "Sure, Why Not": function() {
                    $(this).dialog("close");
                }
                            }
        });

        $.ajax({

            type: "post",
            url: "shownotification.jsp", 
            data: {
                notifyidd: $(this).attr("id")


            },
            error : function(){ 
                alert('Error'); 
            },
            success: function(msg){      

                    alert('Success'); 

            }

        });
    });
});

But the dialog box is not appearing.Please help.

In html i had made a divison for dialog box :

<div id="dialog"></div>

I also included required js and css files.

<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/themes/ui-darkness/jquery-ui.css" rel="stylesheet">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>

But still no success.Please help

Answer 1

You have the auto open flag set to false. Try setting it to true. If you want to still use false, you have to call the .open() method.

http://api.jqueryui.com/dialog/#option-autoOpen