skip to Main Content

My application is MVC 5, using Kendo UI Jquery editable grid. One of the column is a dropdownlist using:

{ field: "ApplicableCourse_ID", title :"Course", values: myDDL1 }

I use the following Ajax to generate the values array myDDL1

$.ajax({
        url:  '@Url.Action("GetFreeAccessDropdownList", "fff")',
        type: "GET",
        async: false,
        cache: false,
        dataType: "json",
        success: function (result) {
            myDDL1.push(JSON.stringify(result.Grid1));
           var grid = $("#grid").data("kendoGrid");
            grid.refresh();
        },
        error: function (request, status, error) {
            alert(request.responseText);
        }
    });

I get the correct value and text:
enter image description here

However; the grid show the value instead of the text. If I use static array:

var myDDL1 = [
        { "value": 54, "text": "Fuel Spill Response Plan" },
        { "value": 56, "text": "Community Fuel Contractor Manual" },
        { "value": 91, "text": "Blocking and Cribbing" }];

The correct text is displayed. Is there a difference between dynamic array and static array?

2

Answers


  1. Chosen as BEST ANSWER

    Just in case someone else has this problem; the solution I used was to generate in the controller a ViewBag of the list:

    var grid1 = db.Courses.Select(c => new
                {
                    value = c.ID,
                    text = c.Name,
                }).ToList();
                ViewBag.Course = grid1;
    

    In the view

    var myDDL1 = @Html.Raw(Json.Encode(ViewBag.Course));
    

    The Grid column

    field: "ApplicableCourse_ID", filterable: { multi: true, search: true }, values: myDDL1 
    

  2. Calling the refresh() method of the grid after populating the collection would be insufficient as it would not refresh the templates and the foreign key column.

    There are two options:

    1. Make the AJAX call directly from the column and there is no need for handing the success callback:

    Remote data binding for foreign key

    1. Set the autoBind property of the grid to false. Inside the success callback of your custom AJAX, call the fetch() method of the data source of the grid.
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search