CODEWITHSUNDEEP
c#asp.net-mvcjquery
Tim
Tim

Reputation: 289

Display PartialView as popup

In my View I have;

@foreach (var item in Model)
{
    <li>@Html.ActionLink("click me", "popup", "SomeData", new{id = item.ID}, new {@class = "PopUp"})</li>
}

I then have a controller that looks like this;

public ActionResult popup(Guid id)
{
    var singelData = db.SomeRandomData.Find(id);

    return PartialView(singelData);
}

And a partialView that looks like this;

<div>This a popup</div>
@Model.metadata1

So far so good, when I click on a link I get redirected to a partialView.

Now to the part where I'm not comfortable, the script section, here is my attempt;

<script src="~/Scripts/jquery-ui-1.8.20.js"></script>
<script type="text/javascript">
    $(function () {
        $('.PopUp').click(function () {
            $('<div/>').appendTo('body').dialog({
                close: function (event, ui) {
                    dialog.remove();
                },
                modal: true
            }).load(this.href, {});

            return false;            
        });
    });
</script>

But it still just returns a view. Where do i go wrong?

Upvotes: 0

Views: 2526

Answers (1)

Darin Dimitrov
Darin Dimitrov

Reputation: 1038720

You should make sure that you have jQuery included before the 2 scripts you have shown. Also I would recommend you using a javascript debugging tool such as FireBug and looking at the console window where you might see potential errors with your scripts.

Upvotes: 1

Related Questions