Method not being triggered from razor view

Question

I am using ASP.NET MVC 3 with the razor view engine.

I have the following method in my NewsController:

public JsonResult GetAllNews()
{
   var items = newsService.FindAll();
   var jsonResult = Json(items);

   return jsonResult;
}

In my view I want to try and call this method to populate my YUI datatable. I put a breakpoint on the first line of this method but the breakpoint is not hit. Here is my code in the view to call this method:

var newsDataSource = YAHOO.util.DataSource('@Url.Action("GetAllNews");');

I even tried:

var newsDataSource = YAHOO.util.DataSource("/News/GetAllNews/");

Both don't seem to work.

Here is my datatable code:

<div id="grdNews"></div>

<script type="text/javascript">
   // News grid
   var newsColumnDefs = [
      { key: "id", label: "Identifier" },
      { key: "title", label: "Title" },
      { key: "body", label: "Body" }
   ];

   //var newsDataSource = YAHOO.util.DataSource('@Url.Action("GetAllNews");');
   var newsDataSource = YAHOO.util.DataSource("/News/GetAllNews/");
   newsDataSource.responseType = YAHOO.util.DataSource.TYPE_JSON;
   newsDataSource.responseSchema = {
      fields: [
         { key: "id" },
         { key: "title" },
         { key: "body" }
      ]
   };

   var myDataTable = new YAHOO.widget.DataTable("grdNews", newsColumnDefs, newsDataSource);
</script>

What am I doing wrong?

Darin Dimitrov · Accepted Answer · 2010-12-14T13:19:53.600

Don't forget to make this method return JSON for GET requests as well:

public JsonResult GetAllNews()
{
   var items = newsService.FindAll();
   return Json(items, JsonRequestBehavior.AllowGet);
}

Also setting a datasource doesn't mean that it will invoke the method. Maybe there's some other part of your code that's problematic. Install FireBug and see if an AJAX request is sent.

UPDATE:

Now that the question has been clarified and you are talking about YUI datatable, here's a full working example:

Controller:

public class HomeController : Controller
{
    public ActionResult Index()
    {
        return View();
    }

    public ActionResult GetAllNews()
    {
        var news = new[] 
        {
            new { id = 1, title = "title 1", body = "body 1" },
            new { id = 2, title = "title 2", body = "body 2" },
            new { id = 3, title = "title 3", body = "body 3" },
        };
        return Json(new
        {
            Result = news
        }, JsonRequestBehavior.AllowGet);
    }
}

View (~/Views/Home/Index.cshtml):

@{
    ViewBag.Title = "Home Page";
}

<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.8.2r1/build/fonts/fonts-min.css" /> 
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.8.2r1/build/datatable/assets/skins/sam/datatable.css" /> 
<script type="text/javascript" src="http://yui.yahooapis.com/2.8.2r1/build/yahoo-dom-event/yahoo-dom-event.js"></script> 
<script type="text/javascript" src="http://yui.yahooapis.com/2.8.2r1/build/connection/connection-min.js"></script> 
<script type="text/javascript" src="http://yui.yahooapis.com/2.8.2r1/build/json/json-min.js"></script> 
<script type="text/javascript" src="http://yui.yahooapis.com/2.8.2r1/build/element/element-min.js"></script> 
<script type="text/javascript" src="http://yui.yahooapis.com/2.8.2r1/build/datasource/datasource-min.js"></script> 
<script type="text/javascript" src="http://yui.yahooapis.com/2.8.2r1/build/datatable/datatable-min.js"></script> 

<script type="text/javascript">
    var newsColumnDefs = [
        { key: "id", label: "Identifier" },
        { key: "title", label: "Title" },
        { key: "body", label: "Body" }
    ];

    var newsDataSource = new YAHOO.util.DataSource('@Url.Action("GetAllNews")');
    newsDataSource.responseType = YAHOO.util.DataSource.TYPE_JSON;
    newsDataSource.responseSchema = {
        resultsList: 'Result',
        fields: [ "id", "title", "body" ]
    };

    var myDataTable = new YAHOO.widget.DataTable("grdNews", newsColumnDefs, newsDataSource); 
</script>

<div id="grdNews"></div>

@Darin: Thanks. What do I need to be on the look out for to if an AJAX request was sent? What else do I need to setup on my app to get it working? — Brendan Vogt, Dec 14 '10 at 10:36
@Brendan, once you install FireBug you may look at the Console or the Net tab. All requests will be listed there. As far as to what you need to set, I cannot answer this question as you didn't even explain what you were trying to do. I would recommend you looking at the documentation and the multiple examples of YUI if this is what you intend to use. I think that your question has nothing to do with ASP.NET MVC. It's about how to use YUI. — Darin Dimitrov, Dec 14 '10 at 10:48
@Darin: I'm trying to bring back news items and populate my datatable. That's it. I need to try and determine why my data is not being brought back. That is what I am trying to do. — Brendan Vogt, Dec 14 '10 at 10:50
@Brendan, I would really recommend you going through the [YUI documentation](http://developer.yahoo.com/yui/datatable/). As I said the controller action is you've shown is perfectly fine (except the small remark about allowing GET requests which are disabled by default for JSON). I suspect the problem you are having is setting your YUI datatable but as you've shown no code about it I cannot say why it doesn't work. Also if you have problems setting YUI you might post another question specifically tagged to it as this no longer relates to ASP.NET MVC. — Darin Dimitrov, Dec 14 '10 at 10:52
@Darin: I agree with you that it is not a MVC issue. But I am not going to open up a new post for that, we can work on this one then everybody knows everything about my scenario. I updated my original post with the javascript code. — Brendan Vogt, Dec 14 '10 at 11:03
@Darin: It is debugging now. I forgot to add the json and connection javascript references :) — Brendan Vogt, Dec 14 '10 at 13:04

Method not being triggered from razor view

1 Answers1