Questions on Kendo UI for jQuery Forum

3 answers

1.4K+ views

I'm looking to set up AntiForgeryTokens throughout an application.

This works fine on normal forms (with @Html.AntiForgeryToken() helper), as well as AJAX posts by sending the token value in a cookie. However I have a problem in some cases when trying to send the cookie with requests from Kendo controls.

For example I have the following in a view:

@Html.AntiForgeryToken()

@(Html.Kendo().Grid<UniTech.ICAP.Extranet.Web.Models.ActivityViewModel.ActivityListItem>(Model.ActivityList)

.Name("Grid")

.Columns(columns =>

{

columns.Bound(i => i.UserName);

columns.Bound(i => i.ActionString).Filterable(filterable => filterable.UI("actionFilter"));

columns.Bound(i => i.ItemString);

columns.Bound(i => i.RepositoryString);

columns.Bound(i => i.ActionDate).Title("Date").Width(150).Format("{0:dd MMM yyyy HH:mm}");

})

.Sortable()

.Filterable(filterable => filterable

.Extra(false)

.Operators(operators => operators

.ForString(str => str.Clear()

.StartsWith("Starts with")

.IsEqualTo("Is equal to")

.IsNotEqualTo("Is not equal to")

))

)

.Resizable(resize => resize.Columns(true))

.DataSource(datasource => datasource.Ajax().ServerOperation(false).Read(read => read.Action("ActivityGridRead", "Admin")))

.Pageable(p => p.PageSizes(new[] { 10, 50, 100 }).Enabled(true))

)

Following from advice in other threads, I have the followin Javascript also on the page:

$(function () {

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

grid.dataSource.transport.options.read.beforeSend = function (req) {

var header = $('[name=__RequestVerificationToken]').val();

req.setRequestHeader('__RequestVerificationToken', header);

};

});

When the page loads, the grid sends a POST to the server to get the activity grid items. There is an attribute that then validates the forgery token:

if (request.IsAjaxRequest())

{

var antiForgeryCookie = request.Cookies[AntiForgeryConfig.CookieName];

var cookieValue = antiForgeryCookie != null

? antiForgeryCookie.Value

: null;

AntiForgery.Validate(cookieValue, request.Headers["__RequestVerificationToken"]);

}

When the request is sent, the validation fails and I cant work out why. This seems to be a problem for any grid that sends a POST to retrieve the data rather than having the data when the page loads.

What I have noticed is that after the first POST fails validation, if I then run the following javascript in firebug console, the validation passes and the grid is populated:

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

Any ideas what I'm doing wrong here?

Thanks

Data Source

answered on 19 Mar 2020

2 answers

118 views

Paging/pager selection

Hi,

Extra li tag shows up when I select a page number.

Thanks,

Grid

answered on 18 Mar 2020

1 answer

431 views

Limit concurrent uploads

I have an upload system in my .Net Core site that allows for a user to upload as many files as they want at a time. The files are uploaded directly to an S3 bucket and then processed. The problem is that when uploading, lets say 1,000 files, the browser does not like to create that many connections and more often than not, files routinely fail to upload. Even with retries enabled, those retries tend to fail since the browser only allows a certain number of concurrent connections.

What I am looking to do is place the files into a queue and only allow 20 files to be actually uploading at any given time (Think of how FileZilla queues items to upload). When a file completes, a new files is added until the queue is exhausted. I already have it so `AutoUpload` is set to `false` and I can place the files into an array to process but the `uploadSelectEvent.sender.upload()` method enables upload for everything.

Is there a way to pause all the uploads prior to enabling the upload so I can then resume them as needed? Is there a better way to handle this?

Upload

answered on 18 Mar 2020

1 answer

357 views

Issue with spreadsheet Range Selection

I have implemented kendo spreadsheet in an angular 8 application and a facing the following issue.
There is a functionality implemented where user can navigate to a particular cell or range of cells selected. I am using the following to do the same.

this.spreadsheet.activeSheet().range(3,2,1,1).select();

it works fine when i pass in 1 as row and column count i.e the 3rd and 4th parameter but if i scroll down a bit so that the data is out of view and select a cell and then try to navigate and select a range of cells with

this.spreadsheet.activeSheet().range(3,2,3,3).select();

It gives me the following error in the console and the navigation stops working.

core.js:6014 ERROR TypeError: e.toRangeRef is not a function<br>

at init.activeCell (kendo.all.min.js:sourcemap:98)<br>

at init.select (kendo.all.min.js:sourcemap:98)<br>

at init.select (kendo.all.min.js:sourcemap:97)<br>

at SafeSubscriber._next (prgx-lib.js:9946)<br>

at SafeSubscriber.__tryOrUnsub (Subscriber.js:183)<br>

at SafeSubscriber.next (Subscriber.js:122)<br>

at Subscriber._next (Subscriber.js:72)<br>

at Subscriber.next (Subscriber.js:49)<br>

at Subject.next (Subject.js:39)

Any idea how to fix this ?

Spreadsheet

answered on 18 Mar 2020

1 answer

106 views

Chart mouseevents invalid positions after parent container scaling

Hello, I have a problem with chart rendering after scale parent container of chart.

Example is presented in dojo: https://dojo.telerik.com/aqEdofAZ

I am transforming chart parent container with code below, chart is looking great but there is something wrong with mouse events. It looks like mouse events are pinned to non transformed chart. For example mouse hover on 2006 (green line) selects 2004 (green line). I tried to refresh and redraw chart but nothing changed. Can you help me with this case?

$(".demo-section").css({
'transform': 'scale(0.5)',
'-ms-transform': 'scale(0.5)',
'-moz-transform': 'scale(0.5)',
'-webkit-transform': 'scale(0.5)',
'transform-origin': '0 0',
'-ms-transform-origin': '0 0',
'-moz-transform-origin': '0 0',
'-webkit-transform-origin': '0 0'
});

Charts

answered on 18 Mar 2020

1 answer

368 views

Disabling Cut, Copy, Paste

How can I disable the cut, copy, paste in the dialog component? I've tried adding an .on event to the canvas and the parent div of the dialog but it isn't working

Diagram

answered on 17 Mar 2020

1 answer

109 views

Event Style

I need to add an event on the scheduler with a start and end time but highlight regions without that time differently. For example, if the event is from 12:00 PM to 8:00 PM with a break from 4:00 pm to 4:30 pm, I would like to show that break time differently in the resource style so the event bar spans the 12-8pm time but the 4-4:30 region is a different color or cross hashed, etc. Is this possible.

Scheduler

answered on 17 Mar 2020

2 answers

1.4K+ views

AutoComplete load more items in scroll end

Do we have any feature for below requirement please confirm..

Initially will load like 10 items (we have around 100+ items )
and then as we scroll through the 10 items and come to the end, will automatically load 10 more items

AutoComplete

answered on 17 Mar 2020

2 answers

150 views

MVVM chart's dataSource doesn't update like I thought it might

I tried what I thought was a pretty basic use of the observables: binding a numeric text box to a value, and then using that value in the datasource. However, it does not work. I'm wondering if what I'm trying to do is possible and I'm just doing it wrong, or if what I'm trying to do isn't possible. Here's a dojo, and the code is below as well.

<div id="example">

<div class="demo-section k-content wide">

<div class="box">

<input id="Value1NumericTextBox" data-role="numerictextbox"

data-format="c0"

data-decimals="0"

data-bind="value: Value1, events: { change: ValueChange }"

data-min="0" />

<input id="Value2NumericTextBox" data-role="numerictextbox"

data-format="c0"

data-decimals="0"

data-bind="value: Value2, events: { change: ValueChange }"