Apparently the dark theme we are using adds the glass.png to tabs. Great. Looks good. However it also seems to be applying to the area inside the tab as well.
It's a little hard to see on most of our popups with tabs but it's visible through gaps in the controls. I have removed the top layer in this image so you can see it. Underneath is the html for one of the pages affected so you can see we aren't setting them up incorrectly. This is the kendo black theme.
@using DispatchCrude.Models;
@model OriginEditModel
@* NOTE: This script section must be at the top of the page for the pop-up to function properly. It cannot be moved to the bottom of the page. *@
<div>
@Html.HiddenFor(x => x.ID)
<ul class="gridErrors NullValidator"></ul>
@(Html.Kendo().TabStrip()
.Name("tabstrip")
.Items(tabstrip =>
{
tabstrip.Add().Text("General").Selected(true).Content(@<text>
<div class="popup-editor-container">
<div class="popup-editor-column-sm">
<div class="popup-editor-label">
@Html.LabelFor(model => model.TimeZoneID).IsRequired()
</div>
<div class="popup-editor-field">
@Html.EditorFor(model => model.TimeZoneID, new { htmlAttributes = new { style = "width:120px; height:30px;" } })
</div>
</div>
<div class="popup-editor-column-sm">
<div class="popup-editor-label">
@Html.LabelFor(model => model.RegionID).IsRequired()
</div>
<div class="popup-editor-field">
@Html.EditorFor(model => model.RegionID)
</div>
<script>
function filterDestination() {
var dataItem = getGridEditRowModel();
let shipperIds = (dataItem.Products != null) ? dataItem.Products.map(x => x.ID).join(',') : -1;
let productIds = (dataItem.Shippers != null) ? dataItem.Shippers.map(x => x.ID).join(',') : -1;
return {
"regionid": dataItem.RegionID || -1,
"terminalid": dataItem.TerminalID || -1,
"productids": (shipperIds != '') ? shipperIds : '-1',
"shipperids": (productIds != '') ? productIds : '-1'
}
}
</script>
<div class="popup-editor-field">
@Html.EditorFor(model => model.PreferredDestinationID, new { table = "GetPreferredDestinations", controller = "origins", filter = "filterDestination()" })
</div>
</div>
</div>
</text>);
tabstrip.Add().Text("Oil Field").Content(@<text>
<div class="popup-editor-container">
<div class="popup-editor-column-sm">
<div class="popup-editor-label">
@Html.LabelFor(model => model.LeaseName).IsRequired()
</div>
<div class="popup-editor-field">
@Html.EditorFor(model => model.LeaseName)
</div>
<div class="popup-editor-label">
@Html.LabelFor(model => model.LegalDescription)
</div>
<div class="popup-editor-field">
@Html.EditorFor(model => model.LegalDescription)
</div>
</div>
</div>
</text>);
tabstrip.Add().Text("GPS").Content(@<text>
<div>
<div class="popup-editor-column-lg">
<div class="popup-editor-label">
@Html.LabelFor(model => model.GeoFenceRadiusMeters)
</div>
<div class="popup-editor-field">
@Html.EditorFor(model => model.GeoFenceRadiusMeters, new { htmlAttributes = new { style = "" } })
</div>
</div>
</div>
</text>);
})
)
</div>
<script>
$("#RegionID,#TerminalID").on("change", function () { refreshDestinations(); });
</script>
I'm using the default theme: "@progress/kendo-theme-default": "4.18.2" with some custom overrides.
The generated CSS has the following incorrect rule (because of the unitless zero, see https://www.w3.org/TR/css3-values/#calc-type-checking ):
.k-combobox .k-dropdown-wrap .k-clear-value {
calc( calc( 1.2em + 8px) + 0 + 6px)
}
This rules comes from the following scss:
$picker-icon-offset: calc( #{$picker-select-calc-size} + #{$picker-select-border-width} + #{$input-icon-offset}) !default;
The unitless zero comes from this value:
$picker-select-border-width: 0 !default;
As a result, the "X" in a combobox overlaps the value.
Unable to edit date properly, when date is selected from the Kendo UI date picker.
Below are steps to reproduce
#1: Select date from the date picker
#2: Click on backspace in date field(place cursor end of Date 08/06/2018 place cursor next to 8) then Control is moved to another place, it supposed to be at 1
Provided below is the dojo for checking
http://dojo.telerik.com/ewANiMuM
Note:
Don't have issue in older versions in Kendo UI 2017 R1 and lower versions,
found the issue from the version Kendo UI 2017 R2 and above
Hi Team,
Can you please help on below issue
By clicking on Backspace on the end of date value(09/08/2018), control is moved to another place(control is moved to first 0 instead of 1)
Issue with second Datepicker from the below sample
Thanks in advance
Copied text is pasted with some (editor's ?) styles.
1. Open the Demo page in the Edge browser:
https://demos.telerik.com/kendo-ui/editor/index
2. Copy some words (e.g. "Kendo UI Editor") from the editor's default text.
3. Paste them at the end of the text.
4. Open developer tools (F12).
5. On the Elements tab, select the pasted paragraph and check its style, you will see <span style="display: inline !important; etc.
Hi,
I have a DropDownTree with checkboxes, like so:
$("#cbxWorkZones").kendoDropDownTree({
placeholder: "Select Work Zones...",
dataTextField: "name",
dataValueField: "id",
valuePrimitive: true,
checkboxes: true,
checkAll: true,
autoClose: false,
autoBind: false,
dataSource: data.workZones
});
I get an instance of it like so:
var wz = $('#cbxWorkZones').data("kendoDropDownTree");
I evaluate value and get this: [] meaning, there are no values selected.
Then I set its value like so:
wz.value(["8", "6"]);
After setting the values, I evaluate value again, and I get this: [8,6,8,6]
Why are the values duplicated?
Thanks!
Juan