Question

I am using Loading a partial view in jquery.dialog as a reference in order to open some partial views inside a dialog box. This has worked for me a few times, but now that I’m trying to use the same exact setup, it just doesn’t work…

I have two issues I’d like to ask about…

The dialog box opens, then once it opens, the page gets redirected to called ActionMethod which is returning the Partial View. So I end up with an un-styled page that displays the correct info. Here’s the code:

    public ActionResult Compare()
        {
            var user = _helper.GetUserFromSession(HttpContext.User.Identity.Name);
            var items = user.WatchList.ToList();
            var viewModel = Mapper.Map<IList<Item>, List<IndexItem>>(items);
            return PartialView(viewModel);
        }

And here’s the jQuery code:

        $('#compareItemsDialog').dialog({
            autoOpen: false,
            width: 850,
            height: 600,
            draggable: false,
            dialogClass: "compareDialog",
            title: 'Compare',
            open: function (event, ui) {
                $(this).load("/WatchList/Compare");
            }
        });
        $('#watchListCompareLink').click(function () {
            $('#compareItemsDialog').dialog('open');
        });

I just do not see why this is causing problems… I’ve got other partial views that are setup exactly the same, yet they are working perfectly!

UPDATE: The above has been resolved. Now I just need an answer to the problem explained below…

How do I pass custom options/data along with the call to the dialog? I am thinking maybe I could do something like $('#compareItemsDialog').dialog('open', { id = someVar }); So is that even possible?

Answer 1

Question: How do I pass custom options/data
along with the call to the dialog?

Instead of calling the jQuery dialog directly, wrap this functionality in you own custom javascript function that accepts your custom data. Then have your javascript branching logic in there.