Question

I’m using Fancybox 1.3.4 with ASP.NET MVC 3.

I have following link :

<a id="various" href="Like/List/@feed.Id" class="petlikeCount liked">@feed.LikeCount</a>

and also jquery :

<script type="text/javascript">
        $(document).ready(function () {

            $("#various").fancybox({
                type: 'ajax'
            });              

        });        
</script>

Controller action in Like controller :

public JsonResult List(int id)
        {
            return Json("success", JsonRequestBehavior.AllowGet);
        }

My problem is that Like/List is never called (checked with the breakpoint) and fancybox just appears and show content of “parent” page….

I also tried with iframe content returning pure html back, but I’m getting same strange behavior as above.

Thank you in advance!

Answer 1

I’d recommend you using HTML helpers instead of hardcoding anchors:

@Html.ActionLink(
    feed.LikeCount, 
    "List", 
    "Like", 
    new { id = feed.Id }, 
    new { id = "various", @class = "petlikeCount liked" }
)

Another thing that you should make sure is that the feed.Id is actually an integer variable so that when the List action is invoked it is correctly passed this id.

So your url should look something like this: /List/Like/123. And then assuming tat you have kept the default route and haven’t messed up with some custom routes, the List action should be called and passed the correct id as argument.

Also I would very strongly recommend you using a javascript debugging tool in your browser such as FireBug in which you will be able to see any potential errors with your scripts as well as the actual AJAX requests being sent which will allow you to more easily debug such problems.