Grid Add/Edit popup not defaulting dropdown

13 posts, 0 answers
  1. Michael
    Michael avatar
    4 posts
    Member since:
    Apr 2013

    Posted 27 Apr 2015 Link to this post

    I have a simple grid with Add/Edit functionality enabled and it's using the popup grid edit mode.  When in that mode, a drop down is not setting the selected value as it should.  If I use inline, everything works like a charm. 

     

    When the add/edit form is rendered, the selected value for the record is not being set in the drop down.  When you submit the form, the value is always correct.  The default value is sent when the selected value drop down list was not changed.  The same goes for editing (value being the previously saved value).

     

    This behavior seems to only happen on combo boxes and drop down lists and it's limited to the popup form.  Below is my view, editor template, and the model.  The field in question is Chaperone.

    Thank You!

    View:

    <%= Html.Kendo().Grid<ChaperoneLogViewModel>()
            .Name("ChaperoneLog")
            .DataSource(datasource => datasource.Ajax()
                .Read("Select", "ChaperoneLogList")
                .Update("Update", "ChaperoneLogList")
                .Create("Create", "ChaperoneLogList")
                .Destroy("Delete", "ChaperoneLogList")
                .Model(model => {
                    model.Id(field => field.Id);
                    model.Field(field => field.Name);
                    model.Field(field => field.Chaperone)
                        .DefaultValue(HttpContext.Current.User.Identity.Name);
                })
                .Filter(filter =>
                {
                    filter.Add(field => field.Date)
                        .IsLessThanOrEqualTo(DateTime.Now)
                        .And()
                        .IsGreaterThanOrEqualTo(DateTime.Now.AddDays(-7));
                    filter.Add(field => field.Chaperone)
                        .IsEqualTo(HttpContext.Current.User.Identity.Name);
                })
                .PageSize(20)
            )
            .EnableCustomBinding(true)
            .ToolBar(toolbar =>
            {
                toolbar.Create();
                toolbar.Excel();
            })
            .Excel(excel =>
            {
                excel.AllPages(true);
                excel.FileName("ChaperoneList_" + DateTime.Now.ToShortDateString()+".xlsx");
                excel.Filterable(true);
            })
            .Events(events => events.Edit("loadResearch"))
            .Columns(columns =>
            {
                columns.Command(commands =>
                {
                    commands.Destroy().Text(" ");
                    commands.Edit().Text(" ").CancelText(" ").UpdateText(" ");
                }).Width(80);
                columns.Bound(column => column.Date).AsDate().Width(90);
                columns.Bound(column => column.Name).Title("Topic");
                columns.Bound(column => column.Symbol).Title("S").Width(60);
                columns.Bound(column => column.BankerListDisp);
                columns.Bound(column => column.ResearchListDisp);
                columns.Bound(column => column.Other);
                columns.Bound(column => column.Chaperone).ClientTemplate("#= ChaperoneDisplay #").Title("C").Width(60);
            })
            .Pageable()
            .Sortable(sort => sort.SortMode(Kendo.Mvc.UI.GridSortMode.SingleColumn))
            .Filterable(filter => filter.Mode(GridFilterMode.Menu))
            .Scrollable(scroll => scroll.Height("auto"))
            .Editable(edit => edit.Mode(Kendo.Mvc.UI.GridEditMode.InLine))
            .Selectable()
            .Resizable(resizing => resizing.Columns(true))
     
    %>

     

    EditorTemplate:

    <%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl" %>
    <%
        var users = Roles.GetUsersInRole("StandardUser");
        var profs = users.Select(WebProfile.GetProfile).ToList();
     
        var list = new List<SelectListItem>();
        list.AddRange(profs.Select(
            x => new SelectListItem
            {
                Text = String.Format("{1}, {0}", x.FirstName, x.LastName),
                Value = Html.Encode(x.UserName)
            })
        );
     
        list = list.OrderBy(x => x.Text).ToList();
    %>
     
    <%=Html.Kendo().DropDownList()
        .Name("Chaperone")
        .DataValueField("Value")
        .DataTextField("Text")
        .HtmlAttributes(new {style = "width: 160px; "})
        .BindTo(list) 
        .OptionLabel("Select a Chaperone...")  
        .Value(Model.ToString())
    %>

     

    Model:

    namespace CyfPortal.ApplicationServices.ViewModels
    {
        [DisplayName("Chaperone Log")]
        public class ChaperoneLogViewModel : ViewModel<ChaperoneLog>
        {
            public ChaperoneLogViewModel()
            {
                Chaperone = HttpContext.Current.User.Identity.Name;
            }
     
            [ScaffoldColumn(false)]
            [Map("Id", ReadOnly = true)]
            public int Id { get; set; }
     
            [DataType(DataType.Date)]
            public DateTime Date { get; set; }
     
            [UIHint("Symbols")]
            public string Symbol { get; set; }
     
            [Display(Name = "Topic")]
            public string Name { get; set; }
     
            [UIHint("SeniorBankers")]
            public string Banker { get; set; }
     
            public string AddBanker { get; set; }
     
            [UIHint("Analysts")]
            public string Research { get; set; }
     
            public string AddResearch { get; set; }
     
            [DataType(DataType.MultilineText)]
            public string Other { get; set; }
     
            [UIHint("Chaperone")]
            public string Chaperone { get; set; }
     
            public string ChaperoneDisplay
            {
                get
                {
                    var prof = WebProfile.GetProfile(Chaperone);
                    var fi = "";
                    var li = "";
                    if (!String.IsNullOrEmpty(prof.FirstName)) fi = prof.FirstName.Substring(0, 1);
                    if (!String.IsNullOrEmpty(prof.LastName)) li = prof.LastName.Substring(0, 1);
                    return fi+li;
                }
            }
     
            public string[] ResearchList
            {
                get
                {
                    if (String.IsNullOrEmpty(Research))
                    {
                        return new string[] { };
                    }
                    return Research.Split(',');
                }
            }
     
            [Display(Name = "Research")]
            public string ResearchListDisp
            {
                get
                {
                    if (String.IsNullOrEmpty(AddResearch)) return Research;
                    return Research + ", " + AddResearch;
                }
            }
     
            public string[] BankerList
            {
                get
                {
                    if (String.IsNullOrEmpty(Banker))
                    {
                        return new string[] { };
                    }
                    return Banker.Split(',');
                }
            }
     
            [Display(Name = "Banker")]
            public string BankerListDisp
            {
                get
                {
                    if (String.IsNullOrEmpty(AddBanker)) return Banker;
                    return Banker + ", " + AddBanker;
                }
            }
        }
    }

  2. Vladimir Iliev
    Admin
    Vladimir Iliev avatar
    2190 posts

    Posted 29 Apr 2015 Link to this post

    Hi Michael,

    Could you please try to use the strongly-typed editor and remove the "Value" option from the editor? Please check the updated editor below:

    <%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<object>" %>
     
    <%=Html.Kendo().DropDownListFor(m => m)
        //Name option is set automatically to the field name
        //.Name("Chaperone") => do not set it
        .DataValueField("Value")
        .DataTextField("Text")
        .HtmlAttributes(new {style = "width: 160px; "})
        .BindTo(list)
        .OptionLabel("Select a Chaperone...")
        //Value is set by the Grid on the client side
        //.Value(Model.ToString()) => do not set it

    Regards,
    Vladimir Iliev
    Telerik
     

    See What's Next in App Development. Register for TelerikNEXT.

     
  3. Michael
    Michael avatar
    4 posts
    Member since:
    Apr 2013

    Posted 29 Apr 2015 in reply to Vladimir Iliev Link to this post

    Unfortunately, strongly-typing the editor doesn't change the behavior.  It's still doesn't default the value.  Attached is a screenshot.

     

    I should have mentioned I'm using MVC4 with aspx views.  I created test projects for MVC4 and MVC5  and the problem seems limited to MVC4.  I can provide an example project.

  4. Vladimir Iliev
    Admin
    Vladimir Iliev avatar
    2190 posts

    Posted 30 Apr 2015 Link to this post

    Hi Michael,

    Could you please provide the runable example which you created - this way we will be able to pinpoint the exact reason for current behavior. 

    Regards,
    Vladimir Iliev
    Telerik
     

    See What's Next in App Development. Register for TelerikNEXT.

     
  5. Dongfen
    Dongfen avatar
    19 posts
    Member since:
    Dec 2012

    Posted 14 Nov 2016 in reply to Vladimir Iliev Link to this post

    Hello, 

    I have the same problem. My popup edit template is working fine.  But I want to have a default value for a dropdown grid when add a new record.

    Did the issue get solved?  What is the fix?

     

    Thanks

    Dongfen

     

  6. Vladimir Iliev
    Admin
    Vladimir Iliev avatar
    2190 posts

    Posted 15 Nov 2016 Link to this post

    Hi Dongfen,

    As the Michael does not respond to the last reply I would assume that the issue is resolved on his side. That why I would suggest to open a new support ticket or forum post and provide runable example where the issue is reproduced. This would help us pinpoint the exact reason for this behavior. 

    Regards,
    Vladimir Iliev
    Telerik by Progress
    Check out the new UI for ASP.NET Core, the most complete UI suite for ASP.NET Core development on the market, with 60+ tried-and-tested widgets, based on Kendo UI.
  7. Emil
    Emil avatar
    4 posts
    Member since:
    Aug 2016

    Posted 01 Dec 2016 Link to this post

    Hello,

    I have the same issue. When the popup edit window shows dropdown list does not show their value. It happens for new records only. I tried to set index and value.

    var index = 0;<br>var default_value = dataSource.length > 0 ? dataSource[index][options.field] : '';<br><br>var input = $('<input/>');<br>input.attr('name', options.field);<br>input.appendTo(container);<br>input.kendoDropDownList( {<br>    dataTextField: options.field,<br>    dataValueField: options.field,<br>    dataSource: dataSource,<br>    value: default_value,<br>    index: index<br>});

     

    If dropdown list expanded I can see that the desired value is selected with thin frame and when I collapse ddl the value begins to be displayed.

  8. Emil
    Emil avatar
    4 posts
    Member since:
    Aug 2016

    Posted 01 Dec 2016 in reply to Emil Link to this post

    Example for this issue in attachment. It can be used on dojo.telerik.com
  9. Konstantin Dikov
    Admin
    Konstantin Dikov avatar
    2004 posts

    Posted 05 Dec 2016 Link to this post

    Hi Emil,

    The default value should be set in the model, as demonstrated in the following demo:
    And below is a link to the modified example that you have attached:
    Hope this helps.


    Regards,
    Konstantin Dikov
    Telerik by Progress
    Telerik UI for ASP.NET MVC is ready for Visual Studio 2017 RC! Learn more.
  10. Emil
    Emil avatar
    4 posts
    Member since:
    Aug 2016

    Posted 13 Dec 2016 in reply to Konstantin Dikov Link to this post

    Hi Konstantin,

    Thak you for your answer.

    What should I do if I don't know any values that can appears in ddl? It can happens if data binding for ddl is remote. I just want to set any value as default (first) if at least one value exists.

  11. Konstantin Dikov
    Admin
    Konstantin Dikov avatar
    2004 posts

    Posted 15 Dec 2016 Link to this post

    Hello Emil,

    The main idea is that you need to define the complex object as defaultValue and if you do not know any existing item, you can assign an object with some null values for example:
    Category: { defaultValue: { CategoryID: 0, CategoryName: ""} },

    You can then handle the dataBound event of the DropDownList and select the first item if the initial value matches the default value that you are defining:
    dataBound: function(e){
        if(e.sender.value() == "0"){
        e.sender.select(0)
      }
    }

    However, you need to ensure that the initial value does not exist in the data bound to the DropDownList.


    Regards,
    Konstantin Dikov
    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  12. Emil
    Emil avatar
    4 posts
    Member since:
    Aug 2016

    Posted 21 Dec 2016 in reply to Konstantin Dikov Link to this post

    Hello Konstantin,

    I tried to write this example but failed. http://dojo.telerik.com/AZUbU/3

    Can you say what's wrong?

  13. Viktor Tachev
    Admin
    Viktor Tachev avatar
    1667 posts

    Posted 23 Dec 2016 Link to this post

    Hi Emil,

    Please examine the example below that illustrates how you can implement Grid with custom popup editing.


    Moreover, check out the following thread that discusses using a dropdown component with popup editing of the Grid.



    Regards,
    Viktor Tachev
    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top