I have an AutoComplete control calling my Controller that has the [Authorize] attribute applied to it. When the session expires the control lets you still type in it and tries to call the controller. Nothing happens on the page to show an issue, but in the browser development tools console, there is a jQuery error reporting a 404 error.
The big question is why is it not either getting a 401 error code or following the redirect it is getting to go to the login page? If it was reporting the correct error code than at least I could capture it and redirect it myself or deal with it as I need to.
Using custom validity as below...
@(Html.Kendo()
.TextBoxFor(m => m.Task)
.Value(null)
.HtmlAttributes(new
{
required = "required",
oninvalid = "this.setCustomValidity('Enter a task')",
oninput = "this.setCustomValidity('')"
})
)
I've tried to do the same for other controls (numeric textbox, datetime picker, autocomplete) but it doesn't work.
For example, when trying the same thing for numeric textbox, in console I get an error "An invalid form control with name='Advance' is not focusable.
@(Html.Kendo()I Created a simple employee auto complete inside a grid i have the following code
in grid
@(Html.Kendo().Grid<DI_IPMS_KENDO.Models.AdminViewModel>()
.Name("grid")
.Columns(columns =>
{
columns.Bound(p => p.EmployeeName).EditorTemplateName("AdminEmp");
columns.Bound(p => p.Team).Width(100);
columns.Bound(p => p.Notification).Width(100);
columns.Bound(p => p.Approval).Width(100);
columns.Command(command => { command.Edit(); command.Destroy(); }).Width(200);
})
.ToolBar(toolbar => toolbar.Create())
.Editable(editable => editable.Mode(GridEditMode.InLine))
.Pageable()
.Sortable()
.Scrollable()
.HtmlAttributes(new { style = "height:430px;" })
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(20)
.Events(events => events.Error("error_handler"))
.Model(model => model.Id(p => p.AdminInfoID))
.Create(update => update.Action("Admin_Create", "Home"))
.Read(read => read.Action("Admin_Read", "Home"))
.Update(update => update.Action("Admin_Update", "Home"))
.Destroy(update => update.Action("Admin_Destroy", "Home"))
)
)
editor template has
@model string;
<script src="https://cdn.kendostatic.com/2023.2.606/js/jquery.min.js"></script>
<script>
function onAdditionalData(e) {
return {
Empltext: e.filter.filters[0].value
}
}
</script>
<div>
@(Html.Kendo().AutoComplete()
.Name("EmployeeName")
.Filter("startswith")
.MinLength(4)
.Placeholder("Search for Employee")
.DataTextField("FullName")
.HtmlAttributes(new { style = "width:50%" })
.DataSource(source =>
{
source
.Read(read =>
{
read.Action("EmpSearchData", "Home")
.Data("onAdditionalData");
})
.ServerFiltering(true);
})
)
</div>
The problem is autoserach works great when i serach but when i click on 'x' clear then it hangs :(. What am i doing wrong
Hello I have being looking for examples on using auto complete using tag helpers but coulnt find any
in my grid column i have
<column field="TechnicianAssigned" width="250" editor="categoryDropDownEditor" />
and the categoryDropDownEditor has code as below....the code hits the url but not sure how to pass the data from column to method and serach the functionality.Any example would be helpful.
function categoryDropDownEditor(data) {
I've been following this Kendo UI tutorial: Server filtering in ASP.NET Core AutoComplete Component Demo | Telerik UI for ASP.NET Core
But although I've made the changes I believe need to be to accommodate our data, no textbox for the user to type ahead into appears. Then looking at the code and especially at the model class, I realized that the field I'm trying to bind to the dataTextField property of kendo-autocomplete, is a nullable string. I'm wondering if that is what's causing the problems I'm experiencing? Here's some code snippets from my MVC view:
<div class="demo-section k-content">
<h5>Find a location</h5>
<kendo-autocomplete name="locations" style="width:100%"
dataTextField="LocationCode"
filter="contains"
min-length="2">
<datasource type="DataSourceTagHelperType.Custom" server-filter="true">
<transport>
<read url="@Url.Action("GetLocationByLocationCode", "SiteToSite")" data="onAdditionalData" />
</transport>
</datasource>
</kendo-autocomplete>
<div class="demo-hint">Hint: type "ca"</div>
<script>
function onAdditionalData() {
return {
text: $("#locations").val()
};
}
</script>
</div>
Here's the Index action method from the controller:
public async Task<IActionResult> Index()
{
BuildSelectLists();
SiteToSite siteToSite = new SiteToSite();
return View(siteToSite);
}
public void BuildSelectLists()
{
ViewData["EmployeeList"] = new SelectList(db.PharmEmployees.Where(x => x.ActiveYn == true).OrderBy(y => y.EmployeeName).ToList(), "EmployeeId", "EmployeeName");
}
And finally here's a snippet of the PharmLocation model class, which includes LocationCode (which is the nullable string I'm binding the dataTextField to:
public partial class PharmLocation
{
public PharmLocation()
{
PharmItemsReturnedExpiredFromLocs = new HashSet<PharmItemsReturnedExpiredFromLoc>();
PharmLocation340BRegistrations = new HashSet<PharmLocation340BRegistration>();
PharmLocationPaprogContracts = new HashSet<PharmLocationPaprogContract>();
}
public int LocationId { get; set; }
public bool? ActiveYn { get; set; }
public string? LocationCode { get; set; }
public string? LocationType { get; set; }
public string? Location { get; set; }
I'm binding an AutoComplete to data server-side and it may, conditionally, already have a value set. I want to make sure that the user cannot add values that are not in the list so I've added a script that searches the dataSource for the value before the form is submitted. The problem seems to be when the textbox is given a value server-side, so it's never typed in or searched client-side before submitting, the dataSource .view() and .data() are empty (so it thinks my text is invalid). How can I get my dataSource to include the data without the user typing in the textbox?
01.
@(Html.Kendo().AutoComplete()
02.
.Name(
"ac-selected-gym"
)
03.
.BindTo(Model.AvailableLocations)
04.
.DataTextField(
"GymName"
)
05.
.Filter(
"contains"
)
06.
.MinLength(1)
07.
.HtmlAttributes(
new
{ @
class
=
"form-control"
, data_selected_gym =
""
, aria_describedby =
"selectedGymHelp"
})
08.
.Placeholder(
"Select your gym"
)
09.
.Value(Model.AvailableLocations.Where(f => f.Id== Model.SelectedId).FirstOrDefault()?.GymName)
10.
.Events(e => e.Change(
"sso.saml2.onGymChange"
))
11.
)
01.
function
getSelectedGym($flnAc) {
02.
var
selectedGym;
03.
04.
var
value = $flnAc.value();
05.
var
gymData = $flnAc.dataSource.view();
//This actually appears to return only the current match (or nothing)
06.
07.
var
searchSource =
function
(dataSource, gymName) {
08.
var
matchedGym;
09.
for
(
var
x = 0, length = dataSource.length; x < length; x++) {
10.
if
(dataSource[x].GymName === gymName) {
11.
matchedGym = dataSource[x];
12.
break
;
13.
}
14.
}
15.
return
matchedGym;
16.
};
17.
18.
selectedGym = searchSource(gymData, value);
19.
20.
//dataSource.view() may not have our item in it e.g. if the textbox was pre-filled server-side rather
21.
//than typed client-side, so search the whole list if not found. (Couldn't find a way to tell the control to update its datasource)
22.
if
(!selectedGym) {
23.
gymData = $flnAc.dataSource.data();
24.
selectedGym = searchSource(gymData, value);
25.
}
26.
27.
return
selectedGym;
28.
}
As you can see I tried to work around .view() being empty but then found that .data() is also empty. I also tried triggering the change event on load, but it was still empty.
The demo here: https://demos.telerik.com/aspnet-core/autocomplete/clientfiltering
is missing this script which is in the other demos.
<script>
function onAdditionalData() {
return {
text: $("#[your control's name]").val()
};
</script>
It would be helpful to be able to report these things from the page.
Hi I have the code and result below, but Auto Complete show not fund any thing i missing or got it wrong here?
@(Html.Kendo().AutoComplete()
.Name("ceaSearch")
.HtmlAttributes(new { style = "width:100%" })
.DataTextField("salesperson_name")
.MinLength(1)
.DataSource(source =>{
source.Read(read =>
{
read.Url("https://data.gov.sg/api/action/datastore_search")
.Data("getCEAData");
})
.ServerFiltering(true)
.Custom()
.Schema(schema => schema
.Data("records")
.Type("json")
.Model(model =>
{
model.Id("salesperson_nam");
model.Field("registration_no", typeof(string));
model.Field("estate_agent_name", typeof(string));
model.Field("estate_agent_license_no", typeof(string));
})
);
}).Template("<span>#: records.salesperson_name#</span>"))
function getCEAData() {
var value = $("#ceaSearch").data("kendoAutoComplete").value();
return {
resource_id: 'a41ce851-728e-4d65-8dc5-e0515a01ff31', // the resource id
q: value
};
}
The API returned data below. but Autocomplate show not found
{"help": "https://data.gov.sg/api/3/action/help_show?name=datastore_search", "success": true, "result": {"resource_id": "a41ce851-728e-4d65-8dc5-e0515a01ff31", "fields": [{"type": "int4", "id": "_id"}, {"type": "text", "id": "salesperson_name"}, {"type": "text", "id": "registration_no"}, {"type": "text", "id": "registration_start_date"}, {"type": "text", "id": "registration_end_date"}, {"type": "text", "id": "estate_agent_name"}, {"type": "text", "id": "estate_agent_license_no"}, {"type": "int8", "id": "_full_count"}, {"type": "float4", "id": "rank"}], "q": "merita", "records": [{"registration_end_date": "2019-12-31", "estate_agent_license_no": "L3008536D", "salesperson_name": "MERITA LOUISE TIN GUEK PING (DENG YUEPING) (MERITA LOUISE TIN)", "registration_no": "R000662B", "rank": 0.0706241, "_full_count": "2", "registration_start_date": "2015-11-03", "estate_agent_name": "LANDPLUS PROPERTY NETWORK PTE LTD", "_id": 30808}, {"registration_end_date": "2019-12-31", "estate_agent_license_no": "L3008536D", "salesperson_name": "MERITA LOUISE TIN GUEK PING (DENG YUEPING) (MERITA LOUISE TIN)", "registration_no": "R000662B", "rank": 0.0706241, "_full_count": "2", "registration_start_date": "2015-11-03", "estate_agent_name": "LANDPLUS PROPERTY NETWORK PTE LTD", "_id": 32886}], "_links": {"start": "/api/action/datastore_search?q=merita&resource_id=a41ce851-728e-4d65-8dc5-e0515a01ff31", "next": "/api/action/datastore_search?q=merita&offset=100&resource_id=a41ce851-728e-4d65-8dc5-e0515a01ff31"}, "total": 2}}
I'm trying to implement the example I'm seeing here: https://demos.telerik.com/aspnet-core/autocomplete/serverfiltering. My code is identical to what is provided in the example.
When using the demo on this page, I see the URLs like this (I'm pulling these from developer tools in the browser):
https://demos.telerik.com/aspnet-core/Home/GetProducts?text=test&filter%5Bfilters%5D%5B0%5D%5Bvalue%5D=test&filter%5Bfilters%5D%5B0%5D%5Boperator%5D=contains&filter%5Bfilters%5D%5B0%5D%5Bfield%5D=ProductName&filter%5Bfilters%5D%5B0%5D%5BignoreCase%5D=true&filter%5Blogic%5D=and
The key I want to point out here is that "text=test" is passed on the querystring to my backend page.
However, when I do this in my development environment, no "text" key is passed, I do however have all the filter keys being passed.
Am I doing something wrong? My code is literally the same as in the example.
Thanks!