Questions on Kendo UI for jQuery Forum

3 answers

6.7K+ views

Hide edit and delete button based on the status of each record.

columns.Command(command => { command.Edit(); command.Destroy(); })

How can I add condition to each record to hide or show these two button?

If it is impossible, how could I handle the button by checking when user click edit button on each record.

Thank you,

Grid

answered on 04 Oct 2018

1 answer

77 views

kendo ui

I want to use some components that kendo- have, for example, I want to use a GRID in an application ASP.NET MVC CORE, but I want to use that GRID in a different way to a GRID in kendo--core.

What do I need to do to get a whole and latest version of Kendo UI Professional ??? How do I use it?? If I get this latest version, how do I know which file I need to use a GRID, for example?

General Discussions

answered on 04 Oct 2018

4 answers

729 views

Selected option ?

Hi,

I'm using your Listbox widget and i'm facing this issue:

Everythime that i use it with data, all the options show up selected.

Ex:
<select...>
<option value="1" selected>Item 1</option>
<option value="2" selected>Item 2</option>
<option value="3" selected>Item 3</option>
...

Example here:
https://docs.telerik.com/kendo-ui/api/javascript/ui/listbox/methods/dataitem

When i manually select an option and send that information by POST, in
the server side i cant know the option selected.

Is there any way to solve this problem?

Thank you

ListBox

answered on 04 Oct 2018

1 answer

229 views

How to cancel sending request with OPTION http method?

I want to avoid sending request with OPTION http method. With below configuration Kendo sending two requests, first with OPTION method that sending nothing and right after with POST method with file data.

$("#fileupload").kendoUpload({

async: {

saveUrl: API_URL+'...',

withCredentials: false,

autoUpload: false,

},

uploadEventHandler (e) {

e.headers.set('Access-Control-Allow-Credentials', 'true');

},

type: "post",

error: function (e) {

var files = e.files;

if (e.operation === "upload") {

...

}

},

upload: function (d) {

d.data = {

...

};

},

showFileList: true,

})

Upload

answered on 04 Oct 2018

2 answers

382 views

Kendo template error on initialization

Kendo gives me error and fails to load components during startup. I am using kendo version 2018.3.911.

This is the error I am getting.

kendo.all.js:232 Uncaught Error: Invalid template:'<div class="k-group-indicator" data-#=data.ns#field="${data.field}" data-#=data.ns#title="${data.title || ""}" data-#=data.ns#dir="${data.dir || "asc"}"><a href="\#" class="k-link"><span class="k-icon k-i-sort-${(data.dir || "asc") == "asc" ? "asc-sm" : "desc-sm"}" title="(sorted ${(data.dir || "asc") == "asc" ? "ascending": "descending"})"></span>${data.title ? data.title: data.field}</a><a class="k-button k-button-icon k-bare"><span class="k-icon k-i-close"></span></a></div>' Generated code:'var $kendoOutput, $kendoHtmlEncode = kendo.htmlEncode;$kendoOutput='<div class="k-group-indicator" data-'+(data.ns)+'field="'+($kendoHtmlEncode(data.field))+'" data-'+(data.ns)+'title="'+($kendoHtmlEncode(data.title || ""))+'" data-'+(data.ns)+'dir="'+($kendoHtmlEncode(data.dir || "asc"))+'"><a href="#" class="k-link"><span class="k-icon k-i-sort-'+($kendoHtmlEncode((data.dir || "asc") == "asc" ? "asc-sm" : "desc-sm"))+'" title="(sorted '+($kendoHtmlEncode((data.dir || "asc") == "asc" ? "ascending": "descending"))+')"></span>'+($kendoHtmlEncode(data.title ? data.title: data.field))+'</a><a class="k-button k-button-icon k-bare"><span class="k-icon k-i-close"></span></a></div>';return $kendoOutput;'

at Object.compile (kendo.all.js:232)

at Object.d [as template] (jquery-1.12.3.js:2)

at kendo.all.js:25533

at kendo.all.js:25912

at kendo.all.js:25919

at kendo.all.js:25525

at kendo.all.js:25528

compile @ kendo.all.js:232

d @ jquery-1.12.3.js:2

(anonymous) @ kendo.all.js:25533

(anonymous) @ kendo.all.js:25912

(anonymous) @ kendo.all.js:25919

(anonymous) @ kendo.all.js:25525

(anonymous) @ kendo.all.js:25528

Any ideas how to fix it? Or how to debug it?

Templates

answered on 03 Oct 2018

2 answers

1.2K+ views

Special character problem

I'm having problems with certain special characters in my use of the Gird.

The grid doesn't seem to like strings in the header (maybe elsewhere) that have parentheses ( ) or square brackets [ ]

I can't give specific content, but suffice it to say a column header like this: Header(XYZ) will break Kendo.js. Changing to square brackets does the same.

It this a problem with headers or will parens kack the the grid no matter where they're found?

I'm hoping that there may be a way out of this that won't require reengineering the client's data source or having to search and replace files (some will have 100s of 1000s of lines).

I don't have the exact error message at the moment but will post it when I do, if needed.

Any help would be appreciated.

Grid

answered on 03 Oct 2018

4 answers

3.5K+ views

Passing arguments from grid event

Is there a way to pass parameters from the grid Events
Can I do something like

.Events(evt=>evt.DataBound("FindNull, MyGridName"))

Grid

answered on 02 Oct 2018

1 answer

173 views

Spread Sheet

Hi,

we wanted to have kendo Spreadsheet like shown in image below, without Action Bar, Tab strip(like Home, insert, Data) and footer. I have removed them, but it breaks functionality down. Is that possible without breaking functionality?

Please let me know.

Thank you

Spreadsheet

answered on 01 Oct 2018

1 answer

2.5K+ views

Get row data from editor template?

I'm working on a kendo grid and I'm having some trouble on a use case I feel like should be pretty straight forward but I can't seem to figure out so apologies if I'm missing something obvious. Basically I have a grid that has two dropdowns using editor templates and two number values, looks something like this:

@(Html.Kendo().Grid(Model.gridModel)

.Name("grid")

.Columns(columns =>

{

columns.Bound(c => c.Type).Width(200).EditorTemplateName("TypeDropDownList");

columns.Bound(c => c.SubType).Width(150).EditorTemplateName("SubTypesDropDownList");

columns.Bound(c => c.ArgOne).Width(50);

columns.Bound(c => c.ArgTwo).Width(50);

})

.Editable(editable => editable.Mode(GridEditMode.InCell))

.DataSource(dataSource => dataSource

.Ajax()

.Batch(false)

.ServerOperation(false)

.Model(model =>

{

model.Id(p => new { p.Type, p.SubType });

model.Field(p => p.Type).DefaultValue("Select Type");

model.Field(p => p.SubType).DefaultValue("Select Sub Type");

model.Field(p => p.ArgOne).DefaultValue(0);

model.Field(p => p.ArgTwo).DefaultValue(0);

})

)

I have an event set up on the change event for the drop down but I'm running into some trouble on how I can get the current row's data: I've tried using the closest('tr') but I'm not getting a result back:

function dropDownGridChange(e) {

var gridObject = $("#grid");

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

var dataItem = grid.dataItem($(this).closest('tr')); //returns undefined

...

I even tried putting a cell close event on the grid itself and was going to try and get the row from the UID but I can't seem to pull that value out either:

function onChangeGrid(e) {

var grid = e.sender;

var cell = grid.select();

var row = cell.closest('tr');

var row_uid = row.attr('data-uid'); //returns undefined

...

Is there any way I can get the data out when the dropdown changes or any other way I could update ArgOne & ArgTwo on that change if I'm not going about this the right way? I'm just not sure where I'm going wrong.

Grid

answered on 01 Oct 2018

9 answers

536 views

Is it possible to use Kendo Grid for jQuery in an Angular 6 app?

Hi,

I have already had some research in KendoUI documents and also from forum threads. Basically I am migrating an Angular 1.x app to latest Angular 6, and we have a fairly complex logic to populate a jQuery Kendo Grid in our old app. I am wondering whether we can continue use this jQuery Grid and all its logic.

I have tried npm package mentioned here https://www.telerik.com/kendo-angular-ui/components/framework/kendo-jquery/ - which seems to be only the components that have no counterpart in the Angular suite. So grid is not in there.

I also tried to include the kendo.all.min.js file in my Angular 6 app - either in angular.json build/scripts section or directly put in a <script> tag in index.html. I have jQuery itself included through npm already, which works ok in the Angular 6 app. It is able to compile but when I try $('.selector').kendoGrid(...) I always get error saying $(...).kendoGrid is not a function.

I will be glad to provide more information if needed. Please let me know if I was doing anything wrong..

Thanks

Grid

answered on 01 Oct 2018