I am using Modal Popup in my MVC3 application it works fine but opens twice for a single Click on the link.
The Modal pop is triggered from the 'Index' view of my Home Controller. I am calling a view 'PopUp.cshtml' in my modal popup. The related ActionMethod 'PopUp' for the respective view is in my 'Home' controller.
Here is the code,
Jquery code on layout.cshtml page,
<script type="text/javascript">
$.ajaxSetup({ cache: false });
$(document).ready(function () {
$(".openPopup").live("click", function (e) {
e.preventDefault();
$("<div></div><p>")
.attr("id", $(this).attr("data-dialog-id"))
.appendTo("body")
.dialog({
autoOpen: true,
title: $(this).attr("data-dialog-title"),
modal: true,
height: 250,
width: 900,
left: 0,
buttons: { "Close": function () { $(this).dialog("close"); } }
})
.load(this.href);
});
$(".close").live("click", function (e) {
e.preventDefault();
$(this).dialog("close");
});
});
</script>
cshtml code in 'PopUp.cshtml'
@{
ViewBag.Title = "PopUp";
Layout = null;
}
<h2>PopUp</h2>
<p>
Hello this is a Modal Pop-Up
</p>
Call modal popup code in Index view of Home Controller,
<p>
@Html.ActionLink("Click here to open modal popup", "Popup", "Home",null, new { @class = "openPopup", data_dialog_id = "popuplDialog", data_dialog_title = "PopUp" })
</p>
What am I doing wrong that the modal pop up opens twice ?
Thanks in Advance !