Questions on Kendo UI for jQuery Forum

1 answer

372 views

Hi,
I have large records around 13000 and I used grid with endless scrollbar for better performance.
But if i want to select last row in grid. Scroll to last row number.
How do i accomplish that? I read blogs for virtual scrollbar but not getting for any endless scrollbar. Thanks in advance.

https://www.telerik.com/forums/vitual-scrolling-client-data-scroll-to-row-number

Grid

answered on 04 Dec 2019

10 answers

2.8K+ views

Export to PDF - Add PDF Header / TItle

I have a grid with the ability to export to PDF. When the user clicks on the Export to PDF, I'd like to prompt the user to enter a header / title that will appear as a header in the PDF document that will get created. Is it possible to do this?

Grid

answered on 04 Dec 2019

8 answers

480 views

Scrollview multiple pages shown at once?

Is it possible to have multiple pages shown at once? Say i want to display 3 at once, and behave like this:

1,2,3

scrolled

2,3,4

scrolled

3,4,5

Is something like this possible?

ScrollView (Mobile)

answered on 03 Dec 2019

6 answers

6.5K+ views

Get dataItem of KendoGrid base grid selected row

I'm trying to encapsulate a method to retrieve the row id from my KendoGrids On every grid in my app I have a hidden column named Id. I would like to get this id from my base grid, on both master grid with childs or a grid with no childs. This is my not working method :

get idSelection() {

var grid = $("#grid").data('kendoGrid');

var row = grid.select();

if (!row.is('.k-master-row')) {

row = row.closest(".k-master-row");

}

const selected = this.grid.dataItem(row);

return selected ? selected.Id : undefined;

}

Grid

answered on 03 Dec 2019

1 answer

12.2K+ views

How to get selected row index in Kendo grid if cell selection has set?

I'm working on a project using MVC 3 and kendo controls. I have a Kendo grid that has set to have GridSelectionType.Row,  and I can get the correct selected row index by using index() function.

Code in .cshtml:
.Selectable(selectable => selectable.Enabled(true).Mode(GridSelectionMode.Multiple).Type(GridSelectionType.Row))

Code in javascript file:
var grid = $('#MyGrid').data("kendoGrid");
var selectedRow = grid.select();
var selectedRowIndex = selectedRow.index();

I also have another Kendo grid and this grid has set to have Cell selection. I can get correct selected cell index by cellIndex() function,  but I cannot get the correct selected row index by using index() function.

Code in .cshtml:
.Selectable(selectable => selectable.Enabled(true).Mode(GridSelectionMode.Multiple).Type(GridSelectionType.Cell))

Code in javascript file:
var grid = $('#MyGrid').data("kendoGrid");
var selectedRow = grid.select();
var selectedRowIndex = selectedRow.index();             // incorrect selected row index returned
var selectedCellIndex = grid.cellIndex(grid.select()); // correct selected cell index returned

Please help. How can I get selected row index on Kendo grid if it is in cell selection type?

Thanks,

Grid

answered on 03 Dec 2019

4 answers

691 views

Set Search/Filter drop down width

Using the Kendo Grid javascript, how do I set the width of the filter drop down in the grid header when there are long texts in the drop down? Basically I do not want wrapping, but at the same time, I do not want to increase the column width.

The length needs to approximately match the length of the longest text.

Grid

answered on 01 Dec 2019

2 answers

87 views

Cannot display Files in Upload alone

Hi,

Im having trouble displaying a list of initial files in the Upload widget. In this dojo (https://dojo.telerik.com/EtuxIgeM) I've set the initial files and they display, but if I remove the 'async' attribute, my files are no longer displayed.

I dont use the upload widget for Async uploading so I dont have these attributes. Please advise.

Thanks,
Grant

Upload

answered on 29 Nov 2019

1 answer

250 views

How to get EndDate from KendoRecurrenceEditor Rule

I want to extract EndDate from Recurrence Rule Editor. I am able to get the EndDate when the user selects datepicker from radioButton but I am not able to find the EndDate when the user selects occurrence(s) or never radiobutton .

var editor = $("#RecurrenceRule").data('kendoRecurrenceEditor');

var endDate = editor._until.value();

The above gives me EndDate from Recurrence Editor. But gives wrong date when occurrence and never is selected.

Is there any function which can give me the EndDate? or is there any property in the KendoRecurrenceEditor which stores this date? or is there any other way where i can evaluate the StartDate and Rule to get the EndDate ?

Thank you!

Scheduler

answered on 29 Nov 2019

1 answer

103 views

Get timeslot only works when viewing full day

Following on from my previous posts (here and here)

My scheduler has a timeline view where the user can specify his start and end times according to which shift they are on. The choices are Early (08:00 - 14:00), Late (14:00 - 22:00), Nights (22:00 - 06:00) or full day (00:00 to 23:59). I have discovered that the code in the linked posts will only work if the view is full day.

In order to try and figure out what is causing this I placed some console.log lines as so:

//Make the scheduler a drop area for drag and drop.

function createDropArea(scheduler) {

var grid = $("#grid").data("kendoGrid");

scheduler.view().content.kendoDropTargetArea({

filter: ".k-scheduler-table td, .k-event",

drop: function (e) {

var offset = $(e.dropTarget).offset();

console.log('drop target: %0', $(e.dropTarget));

var slot = scheduler.slotByPosition(offset.left, offset.top);

console.log('slot startDate: ' + slot.startDate);

console.log('slot start time: ' + slot.startDate.getTime());

var slotResource = scheduler.resourcesBySlot(scheduler.slotByElement($(e.dropTarget)));

console.log('slotResource: %0', slotResource.assignee);

var dataItem = grid.dataItem(grid.select());

var eventStart = slot.startDate;

var eventEnd = new Date(slot.startDate.getTime() + (dataItem.end - dataItem.start));

console.log('event start time: ' + eventStart);

console.log('event end time : ' + eventEnd);

if (dataItem && slot) {

var offsetMiliseconds = new Date().getTimezoneOffset() * 60000;

var newEvent = {

eID: -1,

eClonedID: 0,

status: dataItem.status,

assignee: slotResource.assignee,

title: dataItem.title,

start: eventStart,

end: eventEnd,

requestType: dataItem.requestType,

lastUpdatedBy: $UserID,

isEvRecurring: dataItem.isEvRecurring,

isAllDay: dataItem.isAllDay,

startTimezone: dataItem.startTimezone,

endTimezone: dataItem.endTimezone,

clearNotes: dataItem.clearNotes,

resetToPlanned: dataItem.resetToPlanned,

replicateRecurrence: dataItem.replicateRecurrence,

moveDiff: dataItem.moveDiff,

deleteRecurring: dataItem.deleteRecurring

};

scheduler.dataSource.add(newEvent);

//clear selected row so that we don't have the issue of

//selected items being added when we are cloning or moving events.

grid.clearSelection();

}

});

}

When the scheduler that shows the full day and I drag & drop onto the 09:00 slot the console outputs....

drop target: %0 jQuery.fn.init [td..k-nonwork-hour]

TEST:2089 slot startDate: Tue Nov 26 2019 09:00:00 GMT+0000 (Greenwich Mean Time)

TEST:2090 slot start time: 1574758800000

TEST:2092 slotResource: %0 138

TEST:2096 event start time: Tue Nov 26 2019 09:00:00 GMT+0000 (Greenwich Mean Time)

TEST:2097 event end time : Tue Nov 26 2019 10:30:00 GMT+0000 (Greenwich Mean Time)

This will render the event correctly.

When the scheduler is showing just 06:00 to 14:00 and I drag & drop onto the 09:00 slot the console outputs....

drop target: %0 jQuery.fn.init [td]

TEST:2089 slot startDate: Tue Nov 26 2019 09:00:00 GMT+0000 (Greenwich Mean Time)

TEST:2090 slot start time: 1574758800000

TEST:2092 slotResource: %0 138

TEST:2096 event start time: Tue Nov 26 2019 09:00:00 GMT+0000 (Greenwich Mean Time)

TEST:2097 event end time : Tue Nov 26 2019 10:30:00 GMT+0000 (Greenwich Mean Time)

Here the event is not rendered at all.

The only difference I can see is the drop target. On the one that works we have drop target: %0 jQuery.fn.init [td..k-nonwork-hour] while on the one that does not we have drop target: %0 jQuery.fn.init [td]

Totally lost on this one... any help appreciated.

Drag and Drop

answered on 29 Nov 2019

3 answers

281 views

Filter Row Dropdown Suggestion Bug

Hi,
when using kendo grid with filter in the headers and put the filter to filter in "contains" and not by "starts with" the dropdown suggestion goes always by "starts with".
I can consider this a bug, not a big deal but still it has raised bug tickets in our development environment and it seems something that could be fixable.

Example:
http://demos.telerik.com/kendo-ui/grid/filter-row

In "Ship Name" change the type of filter to "Contains" and start typing some text that would match that "contains" and not just "starts with".

Grid

answered on 28 Nov 2019