I am having a kendo autocomplete combo box, when typing out the keys i get the list of options. But it is not highlighting (focusing) the first option. when i try to hover with mouse it is focused. Adding the sample screenshots.
Kindly do the needful. Thanks in advance
It is working fine with the dropdown
But for the autocomplete
When i hover this with cursor it is working. This is our expectation when typing in the autocomplete.
Hey
I'm trying to do the most simple example in my solution, but I can't seem to get it working.
I'm using this example: http://demos.telerik.com/kendo-ui/autocomplete/angular
but getting e.removeData(....).stop is not a function.
any ideas?
I'm trying to get AutoComplete to work in a new Visual Studio 2022 project. We're using .NET 6.
First question: when I try to run an AutoComplete sample app, I get error CS0246, "The type or namespace name 'Kendo' could not be found (are you missing a using directive or an assembly reference?" I believe the problem is that I don't have a link to Telerik's NuGet server where it can get this information. What is that link, please?
Second, in researching error CS0246 and what I might be able to do about it, I came across a page for a NuGet server from Telerik at nuget.telerik.com/v3/index.json. When I navigated to that link I was prompted to provide my Telerik credentials, which I did. That let me download a the Index.json file, which is was list of other servers, I presume NuGet servers, from Telerik. That's OK, for some individual development, but I want to put this into Azure Pipelines. I really do not want to put my credentials into either Azure Pipelines Library | Secure or Azure KeyVault. What is Telerik's work around so that I can put this information into Azure CI Pipelines?
How can I set the HTML autocomplete attribute on an input which uses Kendo UI AutoComplete widget to a value other than "off"?
So far, I have tried the following code:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled</title>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2021.3.1109/styles/kendo.common.min.css">
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2021.3.1109/styles/kendo.rtl.min.css">
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2021.3.1109/styles/kendo.default.min.css">
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2021.3.1109/styles/kendo.mobile.all.min.css">
<script src="https://code.jquery.com/jquery-1.12.3.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2021.3.1109/js/angular.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2021.3.1109/js/jszip.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2021.3.1109/js/kendo.all.min.js"></script></head>
<body>
<input type="text" id="countries" autocomplete="one-time-code" />
<script>
$(function(){
var countries = [ "Australia", "Canada", "United States of America"];
var countriesDataSource = new kendo.data.DataSource({
data: countries
});
$('#countries').kendoAutoComplete({
dataSource: countriesDataSource
});
});
</script>
</body>
</html>
But if you see the screenshot, no matter the HTML markup, the input gets the autocomplete="off" attribute (and value). Guessing this is part of the autocomplete widget?
I am trying to get round the Chrome issue reported here where the previous input to an input[type=password] is autofilled with a username / email.
So want to know how to set the autocomplete attribute on a Kendo-ified AutoComplete input, to a value of my choice.
Alternatively, any solid method of avoiding Chrome autofill on the Kendo UI AutoComplete widget would be greatly appreciated.
Thanks in advance
Hi Team,
Autocomplete textbox should have type=search to comply with the accessibility guideline [1.3.5 identify input purpose], but i do not see any way to do so.
any help is appreciated.
I am using the AutoComplete widget with a minLength of 4. However, if the user clicks a "GO" button I want to force the search to execute before the minLength is reached. The line where search is called executes without errors while debugging but does nothing. I am using remote data with server filtering. It works perfectly once the min length is reached. Here is my code:
<div id="ddPatientSearch" class="dropdown-menu dropdown-menu-left border-dark" aria-labelledby="btnOpenSearch">
<div class="demo-section k-content" style="width:400px">
<div class="container-fluid">
<div class="row">
<div class="col-10 pl-1 pr-0 text-right">
<input id="txtPatientSearch" class="form-control form-control-sm" placeholder="Search patients" />
</div>
<div class="col-2 pl-1 pr-0">
<button id="btnSearchPatients" type="button">GO</button>
</div>
</div>
</div>
<div class="demo-hint pl-2 text-dark" style="font-size:12px">Hint: Search by name, subscriber, or MRN</div>
</div>
</div>
$(function() {
$("#txtPatientSearch").kendoAutoComplete({
dataTextField: 'PatName',
filter: 'contains',
minLength: 4,
clearButton: false,
template: '#= data.PatName # ( #= data.CurrentAge # #= data.Gender # ) <br> Sub. ID: #= data.SubscriberID # <br> MRN: #= data.MRN #',
dataSource: {
serverFiltering: true,
transport: {
read: {
url: searchUrl,
data: function () {
return {
searchTerm: $('#txtPatientSearch').val(),
patientListId: Filters.getSelectedPatientList().value
}
}
}
},
group: { field: "ResCategory" }
}
});
$('#btnSearchPatients').on('click', function () {
var searchTerm = $('#txtPatientSearch').val();
$('#txtPatientSearch').data('kendoAutoComplete').search(searchTerm);
});
//Keeps the dropdown from closing when the "GO" button is clicked
$('#ddPatientSearch').click(function (e) {
e.stopPropagation();
});
});
I have an autocomplete that users may type in long queries into - the problem is that when they type in long queries the ends of the suggestions are cut of with an ellipsis
We want to keep it a single line, but we want the ellipsis to be on the left of the suggestion so the user can see the end of the autocomplete suggestion instead
See attached
Does anyone know of an easy way to do this? I've tried applying text-align:right and various right based attributes to the autocomplete structure but so far it hasn't worked...
Hello. I am using a custom column editor as shown in your example : https://docs.telerik.com/kendo-ui/knowledge-base/custom-editor-autocomplete. Even in the example that you provided, if I type a value that is not in the list, on focus out the field will display "undefined" and will remain this way even if i try to select another value. Is there a fix for this situation? Thank you in advance :)
I attached a screenshot from your working example.