Hello,
i want to bind the autocomplete to a list of object. But the data in the template is empty:
The code is this:
Kunde:
<TelerikAutoComplete Data="@DataCustomer" TItem="@Customer" ValueChanged="@((string value) => OnComboCustomerValueChanged(value))">
<ItemTemplate>
@(nameof(Customer.customerName))
</ItemTemplate>
<FooterTemplate>
<h6>Anzahl: @DataCustomer.Count()</h6>
</FooterTemplate>
<NoDataTemplate>
<div class="no-data-template">
<TelerikSvgIcon Icon="@SvgIcon.FilesError" Size="@ThemeConstants.SvgIcon.Size.Large"></TelerikSvgIcon>
<p>No items available</p>
</div>
</NoDataTemplate>
</TelerikAutoComplete>
protected override async Task OnInitializedAsync()
{
List<Customer> customers = new List<Customer>();
customers.Add(new Customer()
{
customerId = "",
customerName = ""
});
DataCustomer = customers;
}
private void OnComboCustomerValueChanged(string value)
{
ComboCustomerValue = value;
if (value != null && value.Length > 3)
{
if (DataCustomer == null)
{
List<Customer> Data = new List<Customer>();
}
if (DataCustomer.FirstOrDefault(item => item.customerId == value.ToString()) == null)
{
IO.Swagger.Api.CustomerApi customerApi = new IO.Swagger.Api.CustomerApi("https://server:8080");
foreach (var itemsFound in customerApi.ApiV1CustomerIdGet(Convert.ToInt32(value)))
{
if (DataCustomer.FirstOrDefault(item => item.customerId == itemsFound.Id.ToString()) == null)
{
DataCustomer.Add(new Customer()
{
customerId = itemsFound.Id.ToString(),
customerName = itemsFound.Name + @" (" + itemsFound.Id.ToString() + @")"
});
}
}
}
}
}
What have i made wrong?
Kind regards
Jens
Hi, I want to be able to open the dropdown of the AutoComplete component upon focus of the input field.
I found this can be done with a workaround using Js interop:
https://docs.telerik.com/blazor-ui/knowledge-base/inputs-open-programmatically
However, I feel this functionality should be supported out of the box through some 'OpenOnFocus' parameter on the component.
It would be a very welcome improvement!
Kind regards,
Lennert
I need to disable the browser's autofill option on our Blazor Autocomplete. How can I accomplish this?
THanks
Billy
Hi,
I am trying to implement a loading spinner with the <TelerikAutoComplete> control.
I have overriden the <NoDataTemplate>
<p>@IsLoading</p>
<TelerikAutoComplete
@ref="@AutoCompleteControl"
Data="ActiveDataSet"
@bind-Value="SearchTerm"
DebounceDelay="500"
Placeholder="Search here..."
FilterOperator="StringFilterOperator.Contains"
ClearButton="true">
<NoDataTemplate>
@if (IsLoading)
{
<TelerikLoader Visible="true"
Size="@ThemeConstants.Loader.Size.Large"
ThemeColor="@ThemeConstants.Loader.ThemeColor.Tertiary"
Type="@LoaderType.ConvergingSpinner"/>
}
else
{
<p>No Data</p>
}
</NoDataTemplate>
</TelerikAutoComplete>
where I'm getting the data and updating my 'IsLoading'
private async Task Search(string searchTerm)
{
try
{
// Long running search that updates the data
}
finally
{
IsLoading = false;
StateHasChanged();
// AutoCompleteControl.Rebind(); // Without this the loading spinner never goes away
}
}
If I don't include the AutoCompleteControl.Rebind(); the loading indicator never goes away, despite the Data being updated and IsLoading being set to false.
Is there something I'm missing about how to update the binding inside the <NoDataTemplate>?
Thanks!
I'm using a TelerikAutoComplete as a filter/searchbox for a Grid. I'm using the OnChange event to call a method that gets the filtered Grid data. It works great until the user clicks the (Add) button to add a new record. At this point, the OnChange event fires again because the OnChange also fires for the OnBlur.
The effect is that the user clicks the Add button and they see the spinner in the TelerikLoaderContainer for a second or less, and then they have to click the button again to actually fire the event for the button.
I need to move focus away from the AutoComplete after the first OnChange fires, but FocusAsync() doesn't exist for a TelerikGrid or GridCommandButton.
Hello.
It's possible to hide No Data Template if, when typing, no value are found?
THanks