4
 public ActionResult MeanQ(int id)
{            
    Access access= db.Access.Find(id);
    return PartialView("_MeanQPartial", access);
}

The partial view thats being rendered in the above code is displayed in a Dialog Modal (Jquery)...The link(onclick) that displays the partial view in a Jquery Modal Dialog works well for the first click. Once I close that dialog and click on the link again, the Partial View does not open as expected in a pop up form. It opens as a new page in the browser. How can I make the pop up modal dialog link work the same way every time?

Javascript code is below (Jquery Modal Dialog):

<script type="text/javascript">
$(document).ready(function () {
    //initialize the dialog
    $("#result").dialog({ width: 400, resizable: true, position: 'center', title: 'Access info', autoOpen: false,
        buttons: { "Ok": function () { $(this).dialog("close"); } }
    });
});

$(function () {
    $('#modal').click(function () {
        //load the content from this.href, then turn it into a dialog.

        $('#result').load(this.href).dialog('open');
        return false;
    });
});

HTML Link that triggers the modal dialog:

@Html.ActionLink("PopUp", "MeanQ", new { id = item.AccID }, new { id = "modal" })
ZVenue
  • 4,967
  • 16
  • 61
  • 92
  • 2
    you need to show jquery/javascript code as well as the html, otherwise it's extremely difficult to actually spot what is wrong. – Joakim Jun 09 '11 at 17:21
  • An `ActionResult` doesn't control whether it is shown in a new window or not, the browser does via script/markup/browser-config. – patridge Jun 09 '11 at 17:23
  • Please see edits to my original post for js code. Thank you – ZVenue Jun 09 '11 at 17:29
  • What does your `` look like? – Mark Coleman Jun 09 '11 at 17:32
  • its just an action link: @Html.ActionLink("PopUp", "MeanQ", new { id = item.AccID }, new { id = "modal" }) – ZVenue Jun 09 '11 at 17:34
  • Is `#modal` and child of `#result` or is `#modal` returned in the partial view `_MeanQPartial`? – Mark Coleman Jun 09 '11 at 17:37
  • @Mark : I am not sure what you mean exactly here, but looks like #modal is a child of #result div. I have one more line I missed just above – ZVenue Jun 09 '11 at 20:05
  • @Mark - Using a delegate as per your code $("#result").delegate("#modal", "click", function(){ did not work too. I am getting a full blown browser page instead of a jquery dialog box even for the first time. – ZVenue Jun 09 '11 at 20:19
  • This issue is still not fixed... can anyone help please. Thank you – ZVenue Jun 10 '11 at 13:23
  • Thanks to Charlino and Patricia's help.. this issue is solved. http://stackoverflow.com/questions/6333851/mvc3-only-first-row-link-works-well-with-jquery-modal-dialog – ZVenue Jun 13 '11 at 17:36

3 Answers3

4

Recently I also faced a slimier problem where I wanted to use both partial and full razor view. I followed following article to implement my Modal Dialog. And it worked fine.

http://www.matthidinger.com/archive/2011/02/22/Progressive-enhancement-tutorial-with-ASP-NET-MVC-3-and-jQuery.aspx

Maheep
  • 5,539
  • 3
  • 28
  • 47
1

Without knowing your JavaScript, my guess is you are somehow replacing the <a/> element when loading the PartialView since you mention the <a/> does the default action after loading the modal.

e.g.

$("#someA").click(function(){
  //loads the modal and replaces #someA
});

Try using .live():

$("#someA").live("click", function(){
  //loads the modal and replaces #someA, but still works since you used live()
});

Even better if the element has a common parent, you can use .delegate()

$("#someParentOfA").delegate("#someA", "click", function(){

});
Mark Coleman
  • 40,542
  • 9
  • 81
  • 101
  • Thank you. Please see edits to my original post - for JS code. I tried the ".live" you suggested, it did not work. – ZVenue Jun 09 '11 at 17:28
  • Thanks to Charlino and Patricia's help.. this issue is solved. http://stackoverflow.com/questions/6333851/mvc3-only-first-row-link-works-well-with-jquery-modal-dialog – ZVenue Jun 13 '11 at 17:37
0

Are you using MVC3? Instead of returning an "ActionResult" it might help if you return a "PartialViewResult".

mymex1
  • 148
  • 3
  • Thanks to Charlino and Patricia's help.. this issue is solved. http://stackoverflow.com/questions/6333851/mvc3-only-first-row-link-works-well-with-jquery-modal-dialog – ZVenue Jun 13 '11 at 17:36