Questions on Kendo UI for jQuery Forum

2 answers

714 views

transport.update: only add changed fields in the request body

Hi,

I'd like to perform an odata PATCH operation where only the dirty fields are sent in the request body.The code below is my latest attempt, but the grid continues to send the full set of fields. If I omit the data/type sections of the update option, then I get a PUT request with the full set of fields.

My other attempt involved omitting the update altogether and overriding the saveChanges event to make the request myself, but then I run into issues with dirty fields staying dirty. I know you can mess around with the css to remove the flags, but the datasource fields stay dirty and end up getting updated again the next time the saveChanges event is triggered.

Is there a way to let the grid know that the saveChanges event was successful so that it handles the dirty flags on its own? Another solution?

Thanks.

transport: {

read: {

url: serviceURL + entity.ClassName

},

update: {

url: function (data) {

var key = "(" + data.ID + "," + data.NetworkID + "," + data.From + "," + data.To + ")";

return serviceURL + entity.ClassName + key;

},

type: "PATCH",

data: function (data) {

var row = $("#elementGrid").data("kendoGrid").dataSource.get(data.ID);

var updateData = {};

$.each(row.dirtyFields, function (key, value) {

updateData[key] = row[key];

});

return updateData;

}

Grid

answered on 15 Jun 2018

1 answer

101 views

[Solved] Implement custom editor without losing movable and resizing functionality

In our scheduler we have developed custom event editor which is opened in a new page and not using the default editor. However, if we disable the default editor using

$scope.schedulerOptions = {

editable: false

}

but now we are unable to move or resize the event date range on the scheduler.
Is there a way to make it work without showing the default editor and making the events movable ?
How can we fix this issue?

editable property set to false example

Scheduler

answered on 15 Jun 2018

1 answer

886 views

Error when trying to filter data on grid

I'm getting an error when trying to search for data on my grid.. The error I am receiving is this: "Uncaught TypeError: (d.ComponentId || "").toLowerCase is not a function". Thank you in advance for your help.

my grid definition looks like this:

$("#grid").kendoGrid({

toolbar: [

{ template: kendo.template($("#template").html())}

],

dataSource: {

data: filteredData

},

schema: {

model: {

fields: {

ComponentId: { type: "string", filterable:true },

Description: { type: "string", filterable:true }

}

},

selectable: true,

allowCopy: true,

height: 430,

sortable: true,

refresh: true,

filterable: {

mode: "row"

},

columns: [

{ field: "ComponentId",title: "Component Id", template: "#=test(data)#", filterable:true},

{ field: "Description",title: "Description", template: "#=description(data)#", filterable:true }

],

}).data("kendoGrid");

And my code to filter looks like this..

$("#btnSearch").on("click", function () {

alert("clicked");

var filter = { logic: "or", filters: [] };

$searchValue = $('#searchBox').val();

if ($searchValue) {

$.each($("#grid").data("kendoGrid").columns, function( key, column ) {

if(column.filterable) {

filter.filters.push({ field: column.field, operator:"contains", value:$searchValue});

}

});

}

$("#grid").data("kendoGrid").dataSource.query({ filter: filter });

});

Also, this is the code for my toolbar template:

<script id="template" type="text/x-kendo-template">

<label class="search-label" for="searchBox">Search Grid:</label>

<input type="search" id="searchBox" class="k-textbox" style="width: 250px"/>

<input type="button" id="btnSearch" class="k-button" value="Search"/>

<input type="button" id="btnReset" class="k-button" value="Reset"/>

</script>

Grid

answered on 15 Jun 2018

3 answers

125 views

[Solved] Path linking markers being ignored by Map layers

https://dojo.telerik.com/@alexy99/EKomOrIh

I'm trying to follow below document to link markers with Paths, but every layer is ignoring my paths. No error messages.

https://docs.telerik.com/kendo-ui/controls/diagrams-and-maps/map/how-to/link-marker-to-location

Thanks,

Alex

Map

answered on 14 Jun 2018

2 answers

421 views

in grid collapse the row when expand another row

can u please send me a code to colapse the row dynamically when i expand the other row in grid

Grid

answered on 14 Jun 2018

4 answers

264 views

Loading a component directly from node_modules folder doesn't work with the correct version of jquery

I am using npm to generate the folders inside my project. My goal is to include Kendo UI for jquery components and lunch the Telerik Grid. Bellow are my steps

Running npm inside the root of my project(.csproj)
install --save @progress/kendo-ui

A folder node_modules is generated by default with the npm command, a folder named @progress which I assume has all Telerik dependencies is created inside, as well as a jquery folder. Usually, if you do the same steps with nuget instead of this folder, you get on your package folder a jquery reference that supposed to be used by Telerik components, but all inside of the kendo folder. My questions are the following:

1- If I am using the Visual Studio for an Asp.net Core project, which should be the steps to include correctly the and styles used by .(In case of nuget, do I need to go to my nuget path C:\Users\MyUSer\.nuget\packages\kendouiprofessional\2018.2.530\content\Scripts\kendo\2018.2.530 and take the dependencies from there directly?) How can I run a tool like that installs on the same project all my -dependencies? If npm is the answer, then

2-the jquery folder generated by default has this version v3.3.1, is that the same version that grid component supposed to use, or any version of jquery should be fine for the grid? On the nuget package the version kendo. uses is v1.12.4

Thanks in advance

General Discussions

answered on 14 Jun 2018

1 answer

139 views

Issue when batch editing on Edge

https://demos.telerik.com/kendo-ui/grid/editing

There seems to be an issue when batch editing in the Edge browser. The field reverts to it's previous value when the cell looses focus.

Grid

answered on 14 Jun 2018

3 answers

265 views

Icons are not visible in IE11 browser when enabling untrusted font blocking feature in windows 10

IE 11 browser stating icons are not visible before enabling untrusted font blocking feature in windows 10 link.

Issue: CSS3111: @font-face encountered unknown error.

Spreadsheet

answered on 14 Jun 2018

1 answer

216 views

Resize View HTML window?

My users are wanting a way to enlarge or resize the window that pops up when they click the View HTML button in the Editor widget. Is there a way to do this or is beyond the developer's control? Thanks.

Editor

answered on 14 Jun 2018

3 answers

2.9K+ views

In Kendo Grid, how to Bind Dynamic Columns that Contain Space Comma and Special Characters

Hello Folks,

I have used Parent-Child(Hierarchical) Kendo Grid in one of my project.

Grid contain Columns that are retrieved from database tables. Here retrieved values from the database are dynamic.

Means for 1st parent record there are 3 child columns(Type=A1) and for 2nd parent record there are 4 child(Type=A2) columns and so on.

Here data contain space, comma as well as special characters. Eg

Id | Type | Value

1 | A1 | Standard Reference

2 | A1 | D"

3 | A1 | Family Number

4 | A2 | Material

5 | A2 | Hardness

6 | A2 | Rs in ($)

7| A2 | Dim 7

When data binding occurs to the kendo grid then it is not binding to the kendo grid.And if i removed the space, comma & special characters binding works successfully.

Can you help me how to solve this type of problem?

Thank you.

General Discussions

answered on 14 Jun 2018