404 When Using DataSourceRequest

6 posts, 0 answers
  1. Richard Weeks
    Richard Weeks avatar
    95 posts
    Member since:
    Oct 2009

    Posted 15 Nov 2012 Link to this post

    Following examples, I have a ListView I am trying to populate depending upon the selected values of two ComboBoxes. I got the ComboBoxes populated via DataSource fine but the ListView is giving me problems. Here is some illustrative code:
    @(Html.Kendo().ListView<BusinessObject>()
          .Name("Equipment")
          .TagName("div")
          .ClientTemplateId("template")
          .DataSource(source => source.Read(read =>
              read.Action("ControllerAction", "Controller")
                  .Data("additionalData")))
          .Pageable())
     
    <script>
    function additionalData() {
        return {
            first: $("#First").val(),
            second: $("#Second").val()
        };
    }
    </script>
     
    public JsonResult ControllerAction(
        [DataSourceRequest]DataSourceRequest request,
        int first,
        int second)
    {
        var sites = ServiceManager.SomeService
            .GetBusinessObjects(first, second)
            .ToDataSourceResult(request);
     
        var json = this.Json(sites, JsonRequestBehavior.AllowGet);
     
        return json;
    }

    I get a 404 (not found) for "Controller/ControllerAction". What am I doing wrong?

    Is my whole approach valid?

    The examples often show different ways of accomplishing the same thing, which is very confusing.

    Thank you,
    Richard

  2. Nikolay Rusev
    Admin
    Nikolay Rusev avatar
    2285 posts

    Posted 16 Nov 2012 Link to this post

    Hello Richard,

    I am not sure what the problem is with your code, but if you return `sites` directly from the action method all should work.

    For more details on how bind the ListView widget you can see point 4 in the article: http://docs.kendoui.com/getting-started/using-kendo-with/aspnet-mvc/helpers/listview/binding

    Also make sure that you have both controller named "Controller" in "Controllers"  folder and "ControllerAction" action method for that controller.

    Regards,
    Nikolay Rusev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. UI for ASP.NET MVC is VS 2017 Ready
  4. Richard Weeks
    Richard Weeks avatar
    95 posts
    Member since:
    Oct 2009

    Posted 18 Nov 2012 Link to this post

    Thanks for the info. I have the controller action being called now but the parameters are not being passed. I now have:

    // First Combo
     
    @(Html.Kendo().ComboBox()
        .Name("First")
        .DataTextField("Title")
        .DataValueField("Id")
        .DataSource(source => source.Read(read => read
            .Action("FirstAction", "Controller")))
        .SelectedIndex(0)
    )
     
    // Second Combo
     
    @(Html.Kendo().ComboBox()
        .Name("Second")
        .DataTextField("Title")
        .DataValueField("Id")
        .DataSource(source => source.Read(read => read
            .Action("SecondAction", "Controller")))
        .SelectedIndex(0)
    )
     
    // ListView
     
    @model IEnumerable<MyList>
     
    @(Html.Kendo().ListView<MyList>()
          .Name("MyList")
          .TagName("div")
          .ClientTemplateId("template")
          .DataSource(source => source.Read(read => read
              .Action("GetMyList", "Controller")
              .Data("additionalData"))
              .ServerOperation(false))
              .Pageable())
     
    // additionalData
     
    <script>
    function additionalData()
    {
        return {
            first: $("#First").val(),
            second: $("#Second").val()
        };
    }
    </script>
     
    // Relevant Controller
     
    public JsonResult GetMyList(
        [DataSourceRequest]DataSourceRequest request,
        string first,
        string second)
    {
        var results = ServiceManager.Service
            .GetMyListData(first, second)
            .ToDataSourceResult(request);
     
        var json = this.Json(results, JsonRequestBehavior.AllowGet);
     
        return json;
    }
    Any idea why the parameters in the action are null?

    Richard

  5. Nikolay Rusev
    Admin
    Nikolay Rusev avatar
    2285 posts

    Posted 19 Nov 2012 Link to this post

    Hello Richard,

    If you break into the action method for read in your controller or inspect the `Network` tab of the browser console you will notice the listview widget does not perform ajax calls on paging. This is due to the fact that you have forbidden the server operations in the DataSource configuration by setting: .ServerOperation(false))


    Regards,
    Nikolay Rusev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  6. Richard Weeks
    Richard Weeks avatar
    95 posts
    Member since:
    Oct 2009

    Posted 19 Nov 2012 Link to this post

    Ah, well spotted. I'd left that in from copying from another demo.

    But I seem to be going round in circles. It's probably my server-side bias but frankly, I do not enjoy working with Kendo. When something is not working, debugging client stuff is an absolute joke. Not your fault but I know I'll be sticking with server-side VS.

    Anyway, I adapt the code and now the comboboxes stop populating. I can see the Json coming back fine in Fiddler but nothing in the combobox (nothing happens when I click either dropdown).

    Try:
    @using MvcApplication3.Models
     
    @(Html.Kendo().ComboBox()
        .Name("First")
        .DataValueField("Id")
        .DataTextField("Name")
        .DataSource(source => source.Read(read => read.Action("GetFirst", "Home")))
        .SelectedIndex(0)
     
    @(Html.Kendo().ComboBox()
        .Name("Second")
        .DataValueField("Id")
        .DataTextField("Name")
        .DataSource(source => source.Read(read => read.Action("GetSecond", "Home")))
        .SelectedIndex(0)
     
    @(Html.Kendo().ListView<BusinessObject>()
          .Name("BusinessObjectList")
          .TagName("div")
          .ClientTemplateId("template")
          .DataSource(source => source.Read(read => read.Action("GetBusinessObjects", "Home").Data("AdditionalData")))
          .Pageable())     
     
    <script type="text/x-kendo-template" id="template">
        <p>Name: #=Name#</p>
    </script>
     
    <script>
    function AdditionalData()
    {
        return {
            First: $("#First").val(),
            site: $("#Second").val()
        };
    }
    </script>
     
    public class HomeController : Controller
    {
        private readonly IList<First> first;
     
        private readonly IList<Second> second;
     
        private readonly IList<BusinessObject> businessObject;
     
        public HomeController()
        {
            this.businessObject = new List<BusinessObject>
            {
                new BusinessObject { Id = 1, Name = "First", FirstId = 1, SecondId = 1 },
                new BusinessObject { Id = 2, Name = "Second", FirstId = 2, SecondId = 2 }
            };
     
            this.first = new List<First>
            {
                new First { Id = 1, Name = "First 1" },
                new First { Id = 2, Name = "First 2" }
            };
     
            this.second = new List<Second>
            {
                new Second { Id = 1, Name = "Second 1" },
                new Second { Id = 2, Name = "Second 2" }
            };
        }
     
        public ActionResult Index()
        {
            return this.View();
        }
     
        public JsonResult GetFirst([DataSourceRequest]DataSourceRequest request)
        {
            return this.Json(this.first.ToDataSourceResult(request), JsonRequestBehavior.AllowGet);
        }
     
        public JsonResult GetSecond([DataSourceRequest]DataSourceRequest request)
        {
            return this.Json(this.second.ToDataSourceResult(request), JsonRequestBehavior.AllowGet);
        }
     
        public JsonResult GetBusinessObjects(
            [DataSourceRequest]DataSourceRequest request,
            string first,
            string second)
        {
            int? firstId = null;
     
            int? secondId = null;
     
            if (!string.IsNullOrEmpty(first))
            {
                firstId = int.Parse(first);
            }
     
            if (!string.IsNullOrEmpty(second))
            {
                secondId = int.Parse(second);
            }
     
            var results = (from c in this.businessObject
                           let cid = firstId ?? c.FirstId
                           let sid = secondId ?? c.SecondId
                           where c.FirstId == cid && c.SecondId == sid
                           select c)
                           .ToDataSourceResult(request);
     
            return results == null
                ? null
                : this.Json(results, JsonRequestBehavior.AllowGet);
        }
    }
    I renamed all the actual classes, so apologies if that broke the code. It all works just the client refuses to display the combobox contents.

    /sigh :)

    Richard


  7. Nikolay Rusev
    Admin
    Nikolay Rusev avatar
    2285 posts

    Posted 22 Nov 2012 Link to this post

    Hello Richard,

    The reason for not being able to bind the ComboBox widgets because you are using ToDataSourceResult extension method to process the data. This however will require to set ComboBox DataSource schema to look for data in the "Data" property from the returned JSON. For more details on how configure ComboBox you can visit this article: http://docs.kendoui.com/getting-started/using-kendo-with/aspnet-mvc/helpers/combobox/overview

    For your convenience I've prepared sample app similar to what you've posted here.

    Regards,
    Nikolay Rusev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top
UI for ASP.NET MVC is VS 2017 Ready