DropdownList MVC - Set Default Value at Runtime

[Randy]

I have a Kendo DropdownList as follows:

<div id="dropDownList" class="col-xs-6">

                @(Html.Kendo().DropDownListFor(m => m)
                        .Name("DealerBoothDropDown")
                        .DataTextField("DropDownText")
                        .DataValueField("BoothDetailRowId")
                        .OptionLabel("Select Dealer and Booth...")
                        .AutoBind(false)
                        .Filter("contains")
                        .HtmlAttributes(new { style = "width:500px" })
                        .DataSource(source =>
                        {
                            source.Read(read =>
                            {
                                read.Action("GetDealersBoothsForDropDown", "DealerAccounting");
                            })
                            .ServerFiltering(true); // Let's do server side filtering
                        })
                        .Events(e => {
                            e.Select("onSelect");
                        })
                )
            </div>

When the page loads, I would like to execute some JS that sets a default value in the Dropdown. Can you show me how I might do this.

[Ianko]

Hello Randy,

As you are using remote binding, I will use this demo as a starting point: http://demos.telerik.com/aspnet-mvc/dropdownlist/remotedatasource. 

Due to the remote binding, the dataBound event is the appropriate event to use in your case. Then, use the DataSource API to get the desired item (the one that should be selected by default) and use the value method to select it. 

 

<div class="demo-section k-content">
    <h4>Products</h4>
    @(Html.Kendo().DropDownList()
          .Name("products")
          .DataTextField("ProductName")
          .DataValueField("ProductID")
          .DataSource(source => {
              source.Read(read =>
              {
                  read.Action("GetProducts", "Home");
              });
          })
          .HtmlAttributes(new { style = "width: 100%" })
          .Events(events => events.DataBound("onDataBound"))
    )
</div>

<script>
    function onDataBound(e) {
        var defaultItem = e.sender.dataSource.at(10);
        e.sender.value(defaultItem.ProductID);
    }
</script>

 

Regards,
Ianko
Telerik by Progress

[Anand Kumar]

Hello Team,

I have Created Kendo Gridview with Dropdownlist inside it is not displaying the selected value while binding the gridview.

i am binding the kendo gridview using model value. in model values is available but it is not displaying the selected value and once after changing the dropdown value it is reflecting ID Value in another label where i bind IDtext.

 

Could you please help me to implement this concept.

[Ianko]

Hi Anand ,

The described behavior sounds more related to the Grid and the edit template utilized. As there is no much information how the template is created I suggest you to post a new thread in the Grid section and provide more details and, if possible, a simple example so that we can take a look and help you out with the case.

Regards,
Ianko
Progress Telerik