Inline Editing with Dropdown as Editor.

4 posts, 0 answers
  1. David
    David avatar
    4 posts
    Member since:
    Aug 2013

    Posted 24 Aug 2013 Link to this post

    Hello every one, I m using Kendo Grid on MVC, it is configured for inline editing. here is the sample code


    01.@(Html.Kendo().Grid<Sanwin.ViewModels.Customer.CustomerInfoModel>()
    02..Name("user-Grid")
    03..EnableCustomBinding(true)
    04.//.BindTo(Model.Customers)
    05.  .Events(ev=>ev.Edit("edit"))
    06..Columns(columns =>
    07.{
    08.    
    09.    columns.Bound(p => p.FirstName).Width(150).Title("First Name");
    10.    columns.Bound(p => p.LastName).Width(150).Title("Last Name");
    11.    columns.Bound(p => p.Email).Width(150).Title("Email");
    12. 
    13.    columns.Bound(p => p.Ranking).Width(150).Title("Ranking");
    14.   // columns.ForeignKey(p => p.RankingId, rankingList,"Value","Text").Width(150).Title("Ranking");
    15.    columns.Bound(p => p.Gender1).Title("Gender");
    16.  
    17.    columns.Bound(x => x.UserName).Width(100);
    18.    columns.Bound(x => x.Password).Width(100);
    19.   
    20.     
    21.    columns.Command(command => { command.Edit(); command.Destroy(); }).Width(100).Title("Action");
    22.})
    23..ToolBar(toolBar => toolBar.Create())
    24..Editable(editable => editable.Mode(GridEditMode.InLine))
    25..Pageable()
    26..Sortable()
    27. 
    28.        .DataSource(dataSource => dataSource
    29.            .Ajax()
    30.            .Events(events => events.Error("error_handler"))
    31.            .Model(model => model.Id(p => p.Id))
    32.                                    .Create(update => update.Action("EditingInline_Create", "Customer", ViewBag.CustomerInfoModel))
    33.            .Read(read => read.Action("UsersList", "Customer"))
    34.                    .Update(update => update.Action("EditingInline_Update", "Customer"))
    35.                    .Destroy(update => update.Action("EditingInline_Destroy", "Customer"))

    37.        ))
    On line number 13, we have a column called Ranking, that is a editor template, here is the code for that
    Raanking template
    01.@using System.Web.Mvc;
    02.@using Kendo.Mvc.UI;
    03.@using Sanwin.Services.Catalog;
    04. 
    05.@model string
    06. 
    07.@{
    08.    var _rankingService = DependencyResolver.Current.GetService<IRankingService>();
    09.     var rankings = _rankingService.GetAllRanking().Select(c => new { Id = c.Rankings, Name = c.DisplayText }).ToList();
    10.            rankings.Insert(0, new { Id = 0, Name = "--select--" });
    11.             
    12.            var rankingList=new List<SelectListItem>();
    13.            foreach(var r in rankings)
    14.            {
    15.                rankingList.Add(new SelectListItem
    16.                {
    17.                    Text=r.Name,
    18.                    Value=r.Id.ToString()
    19.                });  
    20.            }
    21.}
    22.@*@(Html.Kendo().DropDownList().Name("Ranking").DataSource(
    23.ds=>ds.Read("RankingList","Catalog")
    24.    )
    25.    //.SelectedIndex(0)
    26.    .DataTextField("Name").DataValueField("Id")
    27.    //.Value(Model.ToString())
    28.    )*@
    29. 
    30.@(Html.Kendo().DropDownList().Name("Ranking").BindTo(rankingList)
    31.    )
    On my model I have this
    1.[UIHint("Ranking")]
    2.       public string Ranking { get; set; }

     on coltroller
    01.for (int i = 0; i < customers.Count; i++)
    02.           {
    03.               if (!customerIds.Contains(customers[i].Id))
    04.               {
    05.                   Customer manager = null;
    06.                   string siteName = "";
    07.                   if (customers[i].ManagerCustomerId.HasValue && customers[i].ManagerCustomerId > 0)
    08.                   {
    09.                       manager = _customerService.GetCustomerById(customers[i].ManagerCustomerId.Value);
    10.                       siteName = manager.EntityId.HasValue ? _customerService.GetEntityById(manager.EntityId.Value).Title : string.Empty;
    11.                   }
    12.                   var customermodel = new CustomerInfoModel
    13.                   {
    14.                       Id = customers[i].Id,
    15.                       Email = customers[i].Email,
    16.                       UserName = customers[i].UserName,
    17.                       Active = customers[i].IsActive,
    18.                       FirstName = customers[i].FirstName,
    19.                       LastName = customers[i].LastName,
    20.                       Ranking = customers[i].Ranking.HasValue && customers[i].Ranking.Value > 0 ? _rankingService.GetRankingByRank(customers[i].Ranking.Value).DisplayText : "",
    21.                       GroupName = customers[i].CustomerGroups.FirstOrDefault() != null ? customers[i].CustomerGroups.FirstOrDefault().Group.Name : string.Empty,
    22.                       Manager = manager != null ? siteName + "-" + manager.UserName : string.Empty,
    23.                       Gender1 = customers[i].Gender,
    24.                       RankingId = customers[i].Ranking.HasValue ? customers[i].Ranking.Value : 0,
    25. 
    26.                   };
    27.                   customerInfoModel.Add(customermodel);
    28.                   customerIds.Add(customers[i].Id);
    29.               }
    30.           }
    31. 
    32. 
    33. 
    34.           return Json(customerInfoModel.ToDataSourceResult(request));

    My problem is that, the grid is working fine, except only on edit mode, on edit mode, the ranking should display a dropdownlist, it is ok, but it is not retaining its value, I mean if on normal mode, its value is Ranking3, on edit mode, the dropdown should have selected item with Ranking3, but is not highlighting that item.

    I have also tried the foreign key column type, but the result is same.

    What wrong I m doing here, please correct me. Its really Urgent.
  2. Grzegorz
    Grzegorz avatar
    1 posts
    Member since:
    Sep 2012

    Posted 24 Aug 2013 Link to this post

    Hello,

    I'm not sure, but you aren't passing current Ranking value to DropDownList in this code:
    @(Html.Kendo().DropDownList().Name("Ranking").BindTo(rankingList)
    You should use something like this:
    @(Html.Kendo().DropDownListFor(m => m).Name("Ranking").BindTo(rankingList)
    or passing current value to dropdown list:
    @(Html.Kendo().DropDownList().Name("Ranking").BindTo(rankingList).Value(Model)
  3. David
    David avatar
    4 posts
    Member since:
    Aug 2013

    Posted 24 Aug 2013 Link to this post

    hello Grzegorz. thanks for your quick reply.
    Here you are saying that I am not passing the ranking value to dropdown list in editor template, but as far I saw, it binds with the column or model variable name. I have a model variable called Ranking and the dropdown list name is also Ranking. since in case of creating, it is sending the correct data, but only in case of edit mode, it is not highlighting the selected value on dropdownlist. But here is one more thing, say when I am creating a new record, I select Ranking2 in dropdown list, it passes the Ranking2 to controller. but on edit row, since the dropdown is not being selected with Ranking2 value, still if I dont change the dropdown value, it will pass the old Ranking2 value, but this time as Text "RANKING2" instead of its ID column.
  4. Daniel
    Admin
    Daniel avatar
    2214 posts

    Posted 28 Aug 2013 Link to this post

    Hello David,

    Does the Ranking field match the "Rankings" property or the "DisplayText" property value in the GetAllRanking method result? From the code that you provided it seems that Ranking is a String and the Rankings needs to be casted to string. Basically, in order for the item to be selected in the dropdownlist, the Ranking field value for the row should be the same as the Value field for the dropdownlist.

    Regards,
    Daniel
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top