Popup not opening for the second time

Question

I'm using popup from webgrid which edits the details of a candidate. The pop is opening when i click for the first time. When i click second time it is not showing up.

//Script

  function EditProduct(cid) {

        var ph = $("#DivToAppendPartialView");
        alert(cid);
        ph.load("/CandidateDetails/EditCandidateDetails?candidateid=" + cid, function () {
            alert('hi');
            ph.dialog({
                modal: true,
                width: 560,
                height: 560,
                title: "Edit Candidate",
                resizable: false
            });
        });
    }

When clicking second time the alert('hi') is firing but not the popup.

//Grid Column

  grid.Column("", header: "Actions", canSort:false,
        format: @<text>
                  @Html.Raw("<img src='/Images/edit-icon.png' alt='Edit' title='Edit' onclick='EditProduct(" + item.CDId + ")'  />")
                  @Html.Raw("<img src='/Images/delete-icon.png' alt='Delete' title='Delete' onclick='DeleteProduct(" + item.CDId + ")'  />")
                 </text>

//Scripts used

<script src="@Url.Content("~/Scripts/jquery-1.4.4.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery-ui.min.js")" type="text/javascript"></script>

Answer 1

This line creates a dialog. By default, the autoOpen property is true, that's why it's opening the first time.

ph.dialog({
    modal: true,
    width: 560,
    height: 560,
    title: "Edit Candidate",
    resizable: false
});

The second time it's called, the dialog is already created so it doesn't run again. Instead, create the dialog once and use the open method to open it...

var ph = $("#DivToAppendPartialView");
ph.dialog({
    modal: true,
    width: 560,
    height: 560,
    title: "Edit Candidate",
    resizable: false,
    autoOpen: false  // don't open on creation
});

function EditProduct(cid) {
    ph.load("/CandidateDetails/EditCandidateDetails?candidateid=" + cid, function () {
        ph.dialog('open');
    });
}