In my cases, I need to assign additional field's value when user select a result from the hint list. For example,
When "10" is selected, tName's value should be "Jeffrey", when "11" is selected, tName's value should be "Jack".
Here is my suggestion: adding a select event in kendo.autocomplete.js
After adding the "select" event, it's quite easy to implement the "field-linking" by add select parameter in options:
Any feedback is welcome.
<
script
>
$(function () {
$("#tCode").kendoAutoComplete({
dataTextField: "Code",
dataSource: [ { Code:"10", Name:"Jeffrey" }, { Code:"11", Name:"Jack" }]
});
});
</
script
>
<
input
id
=
"tCode"
/><
input
id
=
"tName"
/>
When "10" is selected, tName's value should be "Jeffrey", when "11" is selected, tName's value should be "Jack".
Here is my suggestion: adding a select event in kendo.autocomplete.js
if
(separator) {
text = replaceWordAtCaret(caretPosition(that.element[0]), that.value(), text, separator);
}
//2012-01-18 by Jeffrey Lee
//when item is selected, trigger select event with data as argument
if
($.isFunction(that.options.select))
that.options.select(data);
that.value(text);
that.current(li.addClass(SELECTED));
After adding the "select" event, it's quite easy to implement the "field-linking" by add select parameter in options:
<script>
$(
function
() {
$(
"#tCode"
).kendoAutoComplete({
dataTextField:
"Code"
,
dataSource: [{ Code:
"10"
, Name:
"Jeffrey"
}, { Code:
"11"
, Name:
"Jack"
}],
//new "select" event triggered when hint item is selected
select:
function
(data) { $(
"#tName"
).val(data.Name); }
});
});
</script>
<input id=
"tCode"
/><input id=
"tName"
/>
Any feedback is welcome.