Title field populated via dropdownlist

3 posts, 1 answers
  1. Sean
    Sean avatar
    1 posts
    Member since:
    Jul 2013

    Posted 22 Sep 2013 Link to this post

    As per the title, is it possible to have the title field populated via a DropDown in the popup editor rather than a text field?

    I'm using razor to generate the scheduler.

    Thanks.
  2. Answer
    Rosen
    Admin
    Rosen avatar
    3234 posts

    Posted 23 Sep 2013 Link to this post

    Hello Sean,

    You can use the edit event to get reference to the popup editor container and to modify its content. As in this instance to find the title input element and instantiate a KendoUI DropDownList widget. For example:

    function edit(e) {   
        //find the title element and create a DropDownList bound to the all event titles
        e.container.find("[name=title]").removeClass("k-input").kendoDropDownList({
          dataTextField: "text",
          dataValueField: "value",
          dataSource: $.map(this.dataSource.data(), function(e) {
            return {
              text: e.title,
              value: e.title
            }
          })
        });
      }

    Regards,
    Rosen
    Telerik
    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. Sean
    Sean avatar
    1 posts
    Member since:
    Jul 2013

    Posted 23 Sep 2013 Link to this post

    Thanks, very useful. I use a controller method to return the data, below is the code used for completion.

    function edit(e) {
        //find the title element and create a DropDownList bound to the all event titles
        e.container.find("[name=title]").removeClass("k-input").kendoDropDownList({
            dataTextField: "AbsenceName",
            dataValueField: "AbsenceName",
            dataSource: new kendo.data.DataSource({
                transport: {
                    read: {
                        url: ('@Url.Action("AbsenceTypeRead","Schedule")'),
                        dataType: "json"
                    }
                }
            })
        });
    };
Back to Top