CODEWITHSUNDEEP
asp.net-mvcrazorkendo-uikendo-asp.net-mvc
Wayne Battle
Wayne Battle

Reputation: 3

Kendo DropDownListFor won't expand past the bootstrap column

I'm trying to display 2 columns in the dropdownlist and have attempted using templates, etc. but the dropdownlist will not expand to show the full contents horizontally, it is constrained to the size of the control(col-md-4) and shows a horizontal scrollbar on the dropdownlist. 

@(Html.Kendo().DropDownListFor(m => m.StreetPrefix)
    .BindTo(new List<SelectListItem>()
    {
       new SelectListItem() {Text="", Value = ""},
       new SelectListItem() {Text="East", Value = "E"},
       new SelectListItem() {Text="North", Value = "N"}
    })                                    
   .OptionLabel("Select...")
   //.Template("<table style='width:400px'><tr><td>#: data.Value #</td><td>  #: data.Text #</td></tr></table>")
   .HtmlAttributes(new { @class = "col-md-4 " })
)

Is there a way expand the dropdownlist but not the control on the screen?

Upvotes: 0

Views: 439

Answers (1)

David Shorthose
David Shorthose

Reputation: 4497

If it is just the width of the items you want to expand then you can use the AutoWidth option of the control like this: 

@(Html.Kendo().DropDownListFor(m => m.StreetPrefix)
        .BindTo(new List<SelectListItem>()
        {
new SelectListItem() {Text="", Value = ""},
new SelectListItem() {Text="East", Value = "E"},
new SelectListItem() {Text="North", Value = "N"}
        })
       .OptionLabel("Select...")
       .HtmlAttributes(new { @class = "col-md-4 " })
       .AutoWidth(true)
)

this should help https://docs.telerik.com/aspnet-mvc/api/Kendo.Mvc.UI.Fluent/DropDownListBuilder#methods-AutoWidth(System.Boolean)

Upvotes: 1

Related Questions