i have implented Kendo ComboBox but struggling to get selected value ....
$("#_FeeScheme_Input").kendoComboBox({
minLength: 1,
filter: 'contains',
dataTextField: "FeeSchemeDescription",
dataValueField: "FeeSchemeID",
select: onSelect,
dataSource: {
type: "json",
serverFiltering: false,
transport: {
read: "/Qualification/GetAllFeeScheme_JSON"
},
}
});
...
function onSelect(e) {
var dataItem = this.dataItem(e.item.index());
alert("value " + dataItem.text); //NOT WORKING... RETURN NULL VALUE
};
<div class="form-group">
@Html.LabelFor(model => model._FeeScheme.FeeSchemeDescription, new { @class = "control-label col-md-3" })
<div class="col-md-6">
@Html.TextBoxFor(model => model._FeeScheme.FeeSchemeDescription, new { id = "_FeeScheme_Input" })
@Html.ValidationMessageFor(model => model._FeeScheme.FeeSchemeDescription)
</div>
</div>
load("@Url. Action("Load", "Home")" + id); var selected = $('#typesCombo'). data('kendoComboBox'). val(); if (selected == '') { ... }
The selection can be set programmatically by calling the select() method on the widget instance. The following for example will set the selection to 'Thing1'. Finally, if you are using MVVM with declarative initialization, you can bind the selection to a value on a View Model.
The Kendo UI for Angular ComboBox is a form component that lets you choose from a list of options. It is a richer version of the <select> element and supports data binding, filtering, templates, and the entering of custom values.
var c = $('#MyCombo');
// to get selected id
c.val() // and also
c.data('kendoComboBox').value()
// to get selected text
c.data('kendoComboBox').text()
// to get selected item index
c.data('kendoComboBox').select()
// to set selected item e.g. 3
c.data('kendoComboBox').select(2)
The getters/setters from the kendo comboBox are part of the kendoComboBox 'class'.
You can use this.value() or this.text() depending on what you need.
$("#_FeeScheme_Input").kendoComboBox({
minLength: 1,
filter: 'contains',
dataTextField: "FeeSchemeDescription",
dataValueField: "FeeSchemeID",
dataSource: {
type: "json",
serverFiltering: false,
transport: {
read: "/Qualification/GetAllFeeScheme_JSON"
},
},
change: function(){
alert("value " + this.value());
}
});
You can use jquery too, If you try to take value out of events.
var CB= $("#_FeeScheme_Input").data("kendoComboBox");
var description= CB.dataItem(CB.select()).FeeSchemeDescription; // for text field
alert(description);
var CB= $("#_FeeScheme_Input").data("kendoComboBox");
var Id= CB.dataItem(CB.select()).FeeSchemeID; // for value field
alert(Id);
This answer might help
Kendo combobox.value(x) not working correctly
And
Fiddle Example from the same answer
You can also use jquery to get the ID and value like so:
First off give your comboBox a name:
$("#_FeeScheme_Input").kendoComboBox({
Name: 'MyComboBox',
minLength: 1,
...
Then you can get the ID and Value like this:
var myId = $("#MyComboBox").val();
var myText = $("#MyComboBox").data('kendoComboBox').text();
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With