CODEWITHSUNDEEP
javascripthtmlkendo-ui
user123
user123

Reputation: 850

How to get the value of the dropdown list in kendo ui grid?

I have a grid with dropdown and a checkbox. Whenever I have checked the checkbox (multi-select) I want to get the value of the drop downlist that is selected. How can I do that using kendoui.

Please help me here is my fiddle.

And my code: 

<div id="grid"></div>

<input type="button" value="gridSelectedItem" onclick="selectElementContents( document.getElementById('grid') );"
    />

<div>
<input id="dropdownList" runat="server" /></div>
<script type="text/x-kendo-template" id="CheckboxTemplate">
<li unselectable="off" class="k-item nowrap check-item">
    <input type="checkbox" name="#= text #" value="#= value #" class="check-input" #= selected ? "checked" : "" #/>
    <span>#= text #</span>
</li>

Upvotes: 1

Views: 13417

Answers (3)

Hedego
Hedego

Reputation: 294

  1. The following code is for my shift kendo drop down:

<div class="form-group">
  <label>Shift</label>
  <div class="input-group">
    @(Html.Kendo().DropDownListFor(t => t.ShiftId)
      .Name("ShiftId")
      .DataTextField("Text")
      .DataValueField("Value")
      .OptionLabel("...Select Shift...")
      .DataSource(source => source.Read(read => read.Action("GetShifts", "AssessmentResult")))
      .HtmlAttributes(new { style = "width:292px", @required = "required" })
    )
  </div>
</div>
  1. I have also button with on click event:

<button type="button" id="show">Show</button>
  1. The script is like the following which alerts the selected shift value (NB: I have done some research on Telerik Kedno Forum)

<script type="text/JavaScript">
  $('#show').click(function(event) {
    var ShiftId = $("#ShiftId").data("kendoDropDownList").value();            
    alert(ShiftId);

}

Upvotes: 0

t_plusplus
t_plusplus

Reputation: 4209

This does it for me:

var selectedId = $('#MyDropDown').data("kendoDropDownList").value();

Upvotes: 5

Petur Subev
Petur Subev

Reputation: 20203

On a side not - The template that you have defined does not need to contain li element - it is generated automatically for you.

To retrieve the model related to the item you can use the dataItem method of the ddl client object and the index of the option(that's why you need to fix your template because the index will be wrong).

Here is the magical snippet:

var ddl = $('#dropdownList').data().kendoDropDownList;
var model = ddl.dataItem($input.closest('.k-item').index());
alert(model.text);

I updated your fiddle to see it in action.

Upvotes: 8

Related Questions