I have a DatePicker configured:-
@(Html
.Kendo()
.DatePickerFor(x => x.Date)
.HtmlAttributes(
new
{ @
class
=
"form-control"
})
)
When running locally, the date format is correct (for me in en-AU).
When the same code is published to Azure (running en-US) the date format is incorrect.
If the culture is manually set on the client (using kendo.culture("en-AU")) it doesn't make a difference.
If I force the culture on the server side, it works:-
@(Html
.Kendo()
.DatePickerFor(x => x.Date)
.Culture(
"en-AU"
)
.HtmlAttributes(
new
{ @
class
=
"form-control"
})
)
Why is the DatePicker ignoring the client side culture (both implicit and explicit)?
I have some custom validation that has some complicated business rules so I put them all in a function.
On my combobox change event I call the validation function, if it returns true I save the record back to the database and it gets added to the combo.
But if this fails I want to blank out the combo and set focus to it, I have this part all working, the issue I have is that the change event doersn't get triggered the next time they enter the same value.
Example:
1)User types in "Invalid" in the combo, this fails validation so it blanks it out and sets focus
2)If user types in anything OTHER than 'Invalid' then it works as it should, the change event triggers and it executes the logic
3)But if user types 'Invalid' again, it doesn't trigger the change event, it is remembering that value even though it was blanked out.
How do I reset the combo so that anything they type in will trigger the change event?
Hi All,
I have an endpoint that accepts either params username/password or Authorization Header.
I can populate my kendoDropDownList w/o issue using params. (see code below)
var dataSourceAuthorization = new kendo.data.DataSource({
transport: {
read: 'https://restsandbox.azurewebsites.net/services/rest/gettestdata?username=test_api_user&password=Te$tUser1',
type: "GET"
}
});
$("#userList").kendoDropDownList({
dataTextField: "userId",
dataValueField: "userNumber",
dataSource: dataSourceAuthorization,
optionLabel: "Select User"
});
but when I use Authorization header, I'm getting > GET https://restsandbox.azurewebsites.net/services/rest/gettestdata 401 (Unauthorized)
(see code below)
var dataSourceAuthorization = new kendo.data.DataSource({
transport: {
type: "GET",
beforeSend: function (res) {
res.setRequestHeader('Authorization', 'Bearer Te$t_T0ken');
}
}
});
$("#userList").kendoDropDownList({
dataTextField: "userId",
dataValueField: "userNumber",
dataSource: dataSourceAuthorization,
optionLabel: "Select User"
});
Please note that using same Authorization header value with Postman, its working fine. (See attached)
Did I use sendBefore incorrectly? Any idea why its not working with Headers?
Thanks!
Ryan
Under MVC 5 this worked:
@(Html.Kendo().TabStrip()
.Name("tabstrip")
.SelectedIndex(0)
.Items(tabstrip =>
{
tabstrip.Add().Text("Add Children")
.Enabled(false)
.Content(m => Html.Partial("_FamilyIntakeStep3", m))
;
})
})
But under ASP.Net Core, this no longer works. Instead I am getting the class as a string. I am pretty sure this is happening because the call is asynchronous, which means I should add in the await keyword. But I have no idea how to do this in the kendo tabstrip.
Or perhaps there is a completely different solution that I should try?
I have Add Child/Update/Delete functionality in the columns of my TreeList. However, I don't want to display Update or Delete on my root node. I expected to do this using the Hidden attribute but my attempt doesn't work. How do I accomplish this?
My failed attempt:
@(Html.Kendo().TreeList<
GsiPortal.Models.Group
>()
.Name("treelist")
.Columns(columns =>
{
columns.Add().Field(e => e.Name).Width(220).TemplateId("icon-template");
columns.Add().Field(e => e.Description);
columns.Add().Field(e => e.CurrentStatus.Name).Title(nameof(Group.Status));
columns.Add().Field(e => e.AddTimestamp).Width(220).Title("Timestamp").Format("{0:MMMM d, yyyy}");
columns.Add().Command(c => { c.CreateChild().Text("Add"); }).HtmlAttributes(new { style = "text-align: center;" });
columns.Add().Command(c => { c.Edit(); }).HtmlAttributes(new { style = "text-align: center;" }).Hidden(x => x.CustomerInfo != null);
columns.Add().Command(c => { c.Destroy(); }).HtmlAttributes(new { style = "text-align: center;" }).Hidden(x => x.CustomerInfo != null);
})
.Editable(e => e.Mode(TreeListEditMode.PopUp).TemplateName("GroupEdit"))
.Selectable(selectable => selectable.Mode(TreeListSelectionMode.Single))
.DataSource(dataSource => dataSource
.ServerOperation(false)
.Create(create => create.Action("CreateJson", "Groups"))
.Read(read => read.Action("AllJson", "Groups").Data("groupsRead"))
.Update(update => update.Action("UpdateJson", "Groups"))
.Destroy(delete => delete.Action("DestroyJson", "Groups"))
.Model(m =>
{
m.Id(f => f.Id);
m.ParentId(f => f.ParentId);
m.Expanded(true);
m.Field(f => f.Name);
m.Field(f => f.Description);
m.Field(f => f.AddTimestamp).Editable(false);
})
.Events(events =>
{
events.Error("onError");
})
))
When user try to add new items I have to validate the item by calling the service and if its valid I need to add it to the list. I am planning to use the noDataTemplate for this, but not sure how to validate the user entry and sow the option to add only when it is valid. Could you please advise on that
To explain it better, in multiselect I am displaying the List of existing available users in the list. but they can valid users outside the list b checking whether it's valid user or not by calling some external service. if it is valid I want to show the option add that item.
I tried creating noDataTemplate, when I use it as normal javascript(with out ajax callback) like below it's working as expected
<script id="noDataTemplate" type="text/x-kendo-tmpl">
# var value = instance.input.val(); #
# var id = instance.element[0].id; #
# if(value == 'validUser') {#
<div>
do you want to add the user - <span style="font-weight:bold">'#: value #' </span>?
</div>
<br />
<button class="k-button" onclick="addnew('#: id #', '#: value #')" ontouchend="addnew('#: id #', '#: value #')">add new item</button>
# } else { console.log('value: ' + data);#
<div>
user does not exists
</div>
# } #
</script>
But as I have to validate user I used the template as below, it's executing without error, but the Html is not rendering in the template. it's showing the notemplate area, but there is no text inside it. (not even showing no data found). looks it's the issue because of callback. Please let me know how to solve this issue.
<script id="noDataTemplate" type="text/x-kendo-tmpl">
# var value = instance.input.val(); #
# var id = instance.element[0].id; #
# $.post("@Url.Action("validateuser", "AdminWorkflow")", {alias: instance.input.val()}, function(data){#
# if(data) {
<div>
do you want to add the user - <span style="font-weight:bold">'#: value #' </span>?
</div>
<br />
<button class="k-button" onclick="addnew('#: id #', '#: value #')" ontouchend="addnew('#: id #', '#: value #')">add new item</button>
# } else { console.log('value: ' + data);#
<div>
user does not exists test
</div>
# } #
#}) #
</script>
On my grid I just want to display an alternate message than the stock one so I added the following but it doesn't honor the text I assigned to it.
.Editable(editable => editable.Mode(GridEditMode.InLine).ConfirmDelete("My custom delete confirm message"))
I have this stepper that I am forcing the selection to index 2.
-- this is the script part
$(document).ready(function () {
var stepper = $("#meetingSessionStepper").data("kendoStepper");
stepper.select(2);
});
function onSelectStep(e) {
----- This is not triggered when the page loads
}
--- this is the control
@(Html.Kendo().Stepper()
.Name("meetingSessionStepper")
.Linear(false)
.Orientation(StepperOrientationType.Horizontal)
.Steps(s =>
{
s.Add().Label("Preparation");
s.Add().Label("Start Lesson");
s.Add().Label("Attendance");
s.Add().Label("Session Notes");
s.Add().Label("End Lesson");
})
.Events(events => events.Select("onSelectStep"))
)
But for some reason, my event method onSelectStep is not being triggered when the page loads. This method though is triggered when manually clicking the step from the stepper control.
Can you tell me how to template my IsActive column to a CheckBox column. I also want the option of having it show text Yes/No instead of True/False.
@(Html.Kendo().Grid<
Person
>()
.Name("grid")
.Columns(columns =>
{
columns.Command(command => command
.Custom("Detail")
.Click("goDetail"))
.Width(Glossary.Portal.ButtonWidth);
columns.Bound(p => p.FirstName)
.Filterable(ftb => ftb.Cell(cell => cell.Operator("contains")
.ShowOperators(false)
.SuggestionOperator(FilterType.Contains)));
columns.Bound(p => p.LastName)
.Filterable(ftb => ftb.Cell(cell => cell.Operator("contains")
.ShowOperators(false)
.SuggestionOperator(FilterType.Contains)));
columns.Bound(p => p.IsActive);
})
.Pageable()
.Sortable()
.Scrollable()
.Filterable(ftb => ftb.Mode(GridFilterMode.Row))
.HtmlAttributes(new { style = "height:550px;" })
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(20)
.Read(read => read.Action("IndexJson", "Users")
.Data("getData"))
))
<
script
type
=
"text/javascript"
>
function getData() {
return @Html.Raw(Model.GetIndexData());
}
...