Hi,
When I add a window with a draggable containment that changes with browser resizing the kendo window is limited to the containment elements original browser size.
1. run the example with a small browser window.
2. resize the browser to make it bigger.
3. try to resize the kendo window to make it bigger, it will not get bigger than the original containment size.
https://dojo.telerik.com/axuRUkiq/3
Is there an initialization function that I can call to reset the containment? I can kind of fix it by setting the maxHeight, maxWidth options on the window resize.
Thanks.
I have an application with a grid where the delete button is an icon and a tooltip has to be associated with it.
jQuery("#childrenGrid").kendoTooltip({"filter":".k-grid-delete","content":"Delete"}
The grid is with remote data and the tooltip does not show. If the grid uses not remote data the tooltip appears.
Can I make this work?
Dear All,
I am new to Kendo control, please help me with this, I already have Tree View as shown in the attachment, Now I have Expand onclick of button, I know the code to perform Expand, but it doesn't expand complete child nodes, instead it does just only 1 immediate child, if it has more child, we need to keep clicking the Expand button then it does the expand. Please help me how to achive on single click to Expand all the Parent and Child nodes.
Its not repatitive question, I have already searched here,Please help me.
This is My code:
$("#expand").on("click", function(){
var treeview = $("#treeview").data("kendoTreeView");
treeview.expand(".k-item");
})
Hi
I have severals tabs on the tab strip, each ith its own grid.
When I build the grids from JS code I specify autobind = false.
On with my code, I'm doing a call to filter method on a grid to apply some filter when it loads
and a few lines afterward it calls to dataSource.read method.
When I check the network tab on the dev tools I see The current tab grid is calling twice to get the data,
and the other tabs grid call only once to fetch the data.
Why is this behavior?
Attached screenshots of the network tab showing what I mean.
If you need any more data let me know
Thanks
Hi,
Here is html generated for a DropDownList. As you can see, data are well populated.
However when I click on it, I just get "no data found". Maybe I miss something obvious, but I spent hours trying to fix it without success.
Thanks.
<
select
name
=
"K_AGENCE"
id
=
"clientK_AGENCE"
data-bind
=
"value: selected.K_AGENCE, disabled: isDisabled('dis')"
data-role
=
"dropdownlist"
style
=
"display: none;"
class
=
"k-valid"
>
<
option
value
=
"A1"
>Agence 1</
option
>
<
option
value
=
"A2"
>Agence 2</
option
>
<
option
value
=
"A3"
>Agence 3</
option
>
<
option
value
=
"A4"
>Agence 4</
option
>
</
select
>
I found a similar thread for this but the solution is for ASP.Net and for a RadTreeView (https://www.telerik.com/forums/119788-multiple-context-menu-in-radtreeview).
How can i implement this using jQuery and a TreeView?
Thanks!
I am trying to load the culture files(kendo.messages.xx-xx.min.js) from the local disk, is there a good way to do that?
The method you provided is like following:
var baseUrl = 'https://kendo.cdn.telerik.com/2018.3.1017/js/messages/kendo.messages.';
$.getScript(baseUrl + "zh-CN.min.js", function () {
kendo.ui.progress($("#grid"), false);
CreateGrid();
});
I would like to load it like following, but it didn't work for me.
$.getScript("../culture/zh-CN.min.js", function () {
kendo.ui.progress($("#grid"), false);
CreateGrid();
});
Hi,
I have used kendo grid for display of data, but I am getting an issue in databound event of the grid in dataItem.set() method, here property is not getting set for each row of the grid.
function ondataBound(e){
var items = grid.items();
items.each(function (index) {
var dataItem = grid.dataItem(this);
if (dataItem) {
if (dataItem["ActionTaken"] == "Add"){
if (rowChanges[dataItem.id]) {
for (key in rowChanges[dataItem.id]) {
dataItem.set(key, rowChanges[dataItem.id][key]);
}
}
}
}
}
}
Thanks in advance.
Dipak
So far my grid works fine but on datetime filter area it creates a extra dropdown filter which I don't want and couldn't find out where it is coming from.
Couldn't figure out why it is creating it only for datetime column.
my js code is:
$(document).ready(
function
() {
$(
"#listing-grid"
).kendoGrid({
dataSource: {
type:
"json"
,
transport: {
read: {
url:
"@Html.Raw(Url.Action("
CargoListingList
", "
Cargo
", new { cargoType = cargoType }))"
,
type:
"POST"
,
dataType:
"json"
}
},
schema: {
data:
"Data"
,
total:
"Total"
,
errors:
"Errors"
,
model: {
fields: {
CargoTitle: { editable:
false
, type:
"string"
},
CommodityNames: { editable:
false
, type:
"string"
},
CargoQty: { editable:
false
, type:
"number"
},
CargoQtyId: { editable:
false
, type:
"string"
},
IsPartCargo: { type:
"boolean"
},
FirstPort: { editable:
false
, type:
"string"
},
LastPort: { editable:
false
, type:
"string"
},
LaycanStart: { editable:
false
, type:
"datetime"
},
LaycanEnd: { editable:
false
, type:
"datetime"
},
SeName: { editable:
false
, type:
"string"
}
}
}
},
pageSize: @(defaultGridPageSize),
serverPaging:
true
,
serverFiltering:
true
,
serverSorting:
true
},
pageable: {
refresh:
true
,
pageSizes: [@(gridPageSizes)]
},
scrollable:
false
,
sortable:
true
,
filterable:
true
,
columns: [{
field:
"CargoTitle"
,
title:
"Title"
,
width: 315,
headerAttributes: { style:
"text-align:center"
},
attributes: { style:
"text-align:center"
},
template:
'<a href="/cargo/#=SeName#">#=CargoTitle#</a>'
,
headerTemplate:
'<span title="The cargo listing title">Title <i class="fa fa-info-circle" aria-hidden="true"></i></span>'
,
filterable: { extra:
false
}
}, {
field:
"CommodityNames"
,
title:
"Commodity(s)"
,
width: 225,
headerAttributes: { style:
"text-align:center"
},
attributes: { style:
"text-align:center"
},
headerTemplate:
'<span title="Cargo Commodity(s)">Commodity(s) <i class="fa fa-info-circle" aria-hidden="true"></i></span>'
,
filterable: { extra:
false
}
}, {
field:
"CargoQty"
,
title:
"Cargo Qty"
,
width: 125,
template:
"#=CargoQty # #=CargoQtyId #"
,
attributes: { style:
"text-align:center"
},
headerAttributes: { style:
"text-align:center"
},
headerTemplate:
'<span title="Total Cargo Quantity">Cargo Qty <i class="fa fa-info-circle" aria-hidden="true"></i></span>'
}, {
field:
"IsPartCargo"
,
title:
"PCGO"
,
width: 105,
template:
'# if(IsPartCargo) {# <i class="fa fa-check true-icon"></i> #} else {# <i class="fa fa-close false-icon"></i> #} #'
,
attributes: { style:
"text-align:center"
},
headerAttributes: { style:
"text-align:center"
},
headerTemplate:
'<span title="Part Cargo">PCGO <i class="fa fa-info-circle" aria-hidden="true"></i></span>'
,
filterable: { messages: { info:
"Part Cargo Availability:"
, isTrue:
"Yes"
, isFalse:
"No"
} }
}, {
field:
"FirstPort"
,
title:
"First POL"
,
width: 150,
headerAttributes: { style:
"text-align:center"
},
attributes: { style:
"text-align:center"
},
headerTemplate:
'<span title="First Port of Loading">First POL <i class="fa fa-info-circle" aria-hidden="true"></i></span>'
,
filterable: { extra:
false
}
}, {
field:
"LastPort"
,
title:
"Final POD"
,
width: 150,
headerAttributes: { style:
"text-align:center"
},
attributes: { style:
"text-align:center"
},
headerTemplate:
'<span title="Final Descharging Port">Final POD <i class="fa fa-info-circle" aria-hidden="true"></i></span>'
,
filterable: { extra:
false
}
}, {
field:
"LaycanStart"
,
title:
"First Layday"
,
width: 140,
template:
"#= kendo.toString(kendo.parseDate(LaycanStart), 'dd/MM/yyyy HH:mm') #"
,
attributes: { style:
"text-align:center"
},
headerAttributes: { style:
"text-align:center"
},
headerTemplate:
'<span title="The first day for Laycan">First Layday <i class="fa fa-info-circle" aria-hidden="true"></i></span>'
,
filterable: {
ui:
"datetimepicker"
}
}, {
field:
"LaycanEnd"
,
title:
"Cancelation Day"
,
width: 135,
template:
"#= kendo.toString(kendo.parseDate(LaycanEnd), 'dd/MM/yyyy HH:mm') #"
,
attributes: { style:
"text-align:center"
},
headerAttributes: { style:
"text-align:center"
},
headerTemplate:
'<span title="The cancelation day for Laycan">Cancelation Day <i class="fa fa-info-circle" aria-hidden="true"></i></span>'
,
filterable: {
ui:
"datepicker"
}
}
],
filterMenuInit:
function
(e) {
e.container.find(
'.k-filter-help-text'
).remove();
}
});
$(
"#cargoes-grid"
).kendoTooltip({
filter:
".k-header span"
});
});