DropdownList MVC - Set Default Value at Runtime

1 Answer 7726 Views
DropDownList
Randy
Top achievements
Rank 1
Randy asked on 21 Mar 2017, 04:47 PM

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.

1 Answer, 1 is accepted

Sort by
0
Ianko
Telerik team
answered on 23 Mar 2017, 10:23 AM

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
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.
Anand Kumar
Top achievements
Rank 1
commented on 01 Oct 2018, 02:28 PM

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
Telerik team
commented on 02 Oct 2018, 08:04 AM

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
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Tags
DropDownList
Asked by
Randy
Top achievements
Rank 1
Answers by
Ianko
Telerik team
Share this question
or