Hi!
I have a grid setup like below:
<
div
id
=
"SearchDetail"
>
<
div
id
=
"SearchResult"
style
=
"width:850px"
></
div
>
</
div
>
<
script
>
function getSearchResult() {
$("#SearchResult").kendoGrid({
dataSource: {
transport: {
read: {
url: BASE_URL + "SomeApi/GetRequestList",
type: "post",
dataType: "json",
data: {
CardId: $("#ParkingCardId").val(),
StatusId: $("#StatusId").val(),
Status: $("#Status").val()
}
}
},
pageSize: 10,
schema: {
data: "result",
total: "total"
}
},
groupable: false,
sortable: true,
resizable: true,
pageable: true,
filterable: false,
selectable: "single",
dataBound: function(e) {
for (var i = 0; i <
this.columns.length
; i++) {
if (i === 2) {
continue;
}
this.autoFitColumn(i);
}
setTimeout(function() {
$(".k-pager-wrap ul").css({ "margin-left": "0px" });
$(".k-pager-wrap ul li")
.css({ "margin-left": "0px", "padding-left": "0px", "list-style-type": "none" });
},
100);
},
columns: [ {
field: "ParkingCardId",
title: "Card Id",
template: '<a
href
=
"@Url.Action("
NewRequest", "Parking")?cardId=#=ParkingCardId#&
cardTypeString
=
View
">#=ParkingCardId#</
a
>'
}, {
field: "Name",
title: "Full Name"
}, {
field: "Status",
title: "Status"
}, {
field: "IsExpired",
title: "Action",
template: '#if (IsExpired) {# <
a
href
=
"@Url.Action("
NewRequest", "Parking")?cardId=#=ParkingCardId#&
cardTypeString
=
Renew
Card">Renew</
a
> #} else {# #}#'
}, {
field: "StatusId",
title: "Action",
template: '#if (StatusId === 0) {# Show a dialog asking user Y/N. If User press Yes, call Api tp cancel request #} else {# #}#'
}
]
});
}
</
script
>
As per the comment on the second column titles Action, I need to show a Dialog with Yes/No option. If user say Yes, then I need to call the request cancel Api and if that returns success, reload the grid.
I need help in this template or a JS function.
Hi all,
I've been trying for hours to dynamically populate a kendo sub-menu with processed database items, and have those menu items call a javascript function on click. I've read all over the internet that with jQuery, I should really be using event listeners, but that's really difficult when the kendo menu populates its menus with identical IDs and classes on all its items, and I'd have to dynamically create different numbers of event listeners based on the quantity of items in the menu, and I don't even know if that's possible. Therefore, I'm trying to populate the menu with custom div elements with ng-click data to call a function. My javascript file is separate from the HTML file, but I know they're connected properly because other places on the page interact with the javascript functions just fine. When I use ng-click in the inner div I'm inserting via json, absolutely nothing happens. The breakpoint in the called function is never hit, but I know the function works because I created a simple test element elsewhere on the page using the exact same ng-click logic, and it called and executed the function just fine. We're using transformative kendo rather than the raw HTML tags. Here's a code snippet:
//Transform the kendo menu
$("#kendoMenu").kendoMenu();
//other code populating $scope.listOfMilestone from the database, we know that works because the vis timeline generates correctly
var milestonesReadable = new Array();
for (var i = 0; i < $scope.listOfMilestones.length; i++) {
var milestoneDate = new Date($scope.listOfMilestones[i].StartDate);
var dateString = (milestoneDate.getMonth() + 1) + "/" + milestoneDate.getDate() + "/" + milestoneDate.getFullYear();
milestonesReadable.push({
text: "<div ng-click=\"navigate('" + dateString + "')\">" + $scope.listOfMilestones[i].Title + " (" + dateString + ")</div>",
encoded: false
});
}
$("#dropdownMilestoneList").kendoMenu({
dataSource: milestonesReadable
});
//way further down in the javascript:
$scope.navigate = function (dateString) {
debugger;
$scope.timeline.moveTo(dateString);
}
Here's the essential structure of our <ul> structure that the kendo menu uses:
<ul id="kendoMenu>
<li>
Customize Timeline
<ul>
<!--many layers of menu that we know all work correctly-->
<li>
Functions
<ul>
<li>
Go to Milestone
<ul id="dropdownMilestoneList></ul>
</li>
</ul>
</li>
</ul>
</li>
</ul>
When that innermost ul tag is populated (which appears correctly with appropriate data), and is checked using inspect element, you can see inside each <span class="k-link"> tag that indicates a menu item, there is indeed a div element with correct ng-click data, exactly as it was in my test element that worked. However, when you click on any of these menu items, the ng-click just doesn't do anything. No function call, no error, just nothing. When I replace it with the base HTML's onclick, an error is thrown, though:
Uncaught ReferenceError: navigate is not defined
at HTMLDivElement.onclick
I'm at a total loss. Any advice would be appreciated.
Thanks.
Hello,
I am using kendo timeline javascript way . initially i bring only content for 1 timeline item . on timeline change i send request to request content for another item.
1) I am able to get the content but on updating the data source using
$(
"#SampleTimeline"
).data(
'kendoTimeline'
).dataSource.data()[i].set(
"Description"
,response)
it refresh, the timeline and it moves to initial first item . I also tried
$(
"#SampleTimeline"
).data(
'kendoTimeline'
).refresh()
It does same , moves to first item
2) How to get index of clicked item in timeline ? so that i can open dynamically item that was clicked. (After refresh it moves to 1st content, which is not good as UI/UX)
Hi
Does FileManager support retrieving data in batches ie Endless scrolling.
We want to use FileManager but we can have thousands of items in a folder and retrieving it all at one go does not work for us unfortunately
Regards
Kevin
Hey folks,
i have a websocket delivers updates for my datasource. So if i get an update, i do a pushUpdate on the datasource an it is also displayed in my grid. But when i edit the specific dataItem i get the following error after clicking on "save". How do i fix this error or is there any workaround?
Thanks so far.
Chris
kendo.all.js:4571 Uncaught TypeError: i.wrap is not a function
at init (kendo.all.js:4571)
at init._checkValidity (kendo.all.js:22720)
at init.validateInput (kendo.all.js:22641)
at init._validate (kendo.all.js:40512)
at r.proxy (jquery-1.12.4.js:529)
at r.trigger (kendo.all.js:124)
at r.set (kendo.all.js:4637)
at r.set (kendo.all.js:4803)
at init.set (kendo.all.js:8280)
at init.change (kendo.all.js:8480)
var ObservableObject = Observable.extend({
init: function (value) {
var that = this, member, field, parent = function () {
return that;
};
Observable.fn.init.call(this);
this._handlers = {};
for (field in value) {
member = value[field];
if (typeof member === 'object' && member && !member.getTime && field.charAt(0) != '_') {
member = that.wrap(member, field, parent); //error here
}
that[field] = member;
}
that.uid = kendo.guid();
},