Questions on Kendo UI for jQuery Forum

4 answers

247 views

Aggregate function returns empty object after query

http://jsbin.com/lahaficupu/1/edit?html,output

Data Source

answered on 26 Apr 2018

3 answers

547 views

Kendo Grid - Angular typescript pagination at top

I have used kendo grid in angular typescript, I do want to have move pagination top of the grid. Can you please help to get this done?

Thanks in advance.

Grid

answered on 26 Apr 2018

4 answers

435 views

Inline + batch grid editing is completely broken

Inline editing does not function at all within the constraints of batch editing and is creating significant problems for our development team.

To see this in effect: Add a new record to a grid with inline editing and batch editing set. Hit the update button for that record.

When hitting the Update button with inline editing setup, the saveRow method calls the dataSource sync method without regard to the batch setting. Note the console.log statements indicating the

At the very least, this needs to be called out within the API documentation.

This behavior can be seen with the following (same example on both links, duped for backup):

http://dojo.telerik.com/@djones/EfOXi

https://jsfiddle.net/8szucmty/

Grid

answered on 26 Apr 2018

11 answers

1.5K+ views

[Solved] Delete Muliple Rows having Checkbox and using common Delete Button

Could any one help me how to delete muliple Rows in grid each having checkboxes and by clicking common delete button will delete the selected rows.Clicking on rows apart from checkbox should not make look like as selected /enabledor in different colour.
I am using only Kendo UI web and Framework .. So my code is like

MyTemplate:
$("#rfgGrid").kendoGrid(
{
dataSource : DataSource,
editable : true,
height : 260,
columns : [
{
field : "select",
title : "Select",
width : "16%",
template: "<input type='checkbox' class='checkbox' />"
},
{
field : "name",
title : "Name",
width : "35%"
}]
});

My Java Script:

$('#rfgGrid input:checked.checkbox').each(function(){
var dataItem1= grid.dataItem($(this).closest('tr'));
grid.dataSource.remove(dataItem1);
}

By this only one row is got deleted even if I select many in the check box..

could any one guide me or help me wit code on http://jsfiddle.net or http://jsbin.com..

Regards,
Winds

Grid

answered on 26 Apr 2018

3 answers

1.3K+ views

Batch Editing and not save per row edits

I am creating an inline editable grid where I can add row after row or edit a row or delete a row and during that whole process, I don't want to save any changes to the DB. I am using batch:true in the dataSource. I also have the add/edit/delete/done/saveAll buttons outside the grid (not using the toolbars).

Currently, I am calling addNew() from the add button and a new row appears with the editable controls (dropdown, etc) - all good so far

When I click on the done button, I want the current row to stop editing and turn into static text in the grid, but not trigger the create/update/etc options in the dataSource.

When I click on the save button, that is when the changes should be sent to the DB via the dataSource settings.

How can I achieve this?

Thanks,

--Ed

Grid

answered on 26 Apr 2018

3 answers

158 views

[Solved] Grid not displaying data

Trying to display data from a remote api sending jsonp and using server paging. For some reason the grid will not display the data. There are no error messages and Chrome/FF have no trouble parsing the jsonp. To get this to work I can change either the API or the web app, whatever it takes.

Here's the jsonp:

jQuery112403661894688946523_1524408300528([{"total":4,"d":[{"t_id":6,"thread_title":"The Latest news is not good","thread_body":"Here is a long description of the problem and no solution offerred. Here is more typical BB nonsense. Here's a personal story about more nonsense..","thread_created_dt":"2018-03-21T18:08:32.7651816","thread_edited_dt":"2018-03-21T18:08:32.7651816","up_count":0,"down_count":0,"posts_count":3,"posts_last_dt":"2018-04-17T02:21:02.5061225","posts_first_dt":"2018-03-21T18:20:18.1132348","u_id":2,"username":"scdecade","user_created_dt":"2018-01-06T15:52:50.0880940","ranking":1},{"t_id":4,"thread_title":"Lorum ipso lorum","thread_body":"Fets over on everyone.","thread_created_dt":"2018-01-06T16:45:05.1147048","thread_edited_dt":"2018-01-06T17:28:12.0919741","up_count":1,"down_count":1,"posts_count":58,"posts_last_dt":"2018-01-10T15:56:08.7811010","posts_first_dt":"2018-01-06T21:42:54.3239900","u_id":2,"username":"scdecade","user_created_dt":"2018-01-06T15:52:50.0880940","ranking":2}]}])

Here's the html body :

<body>
<br style="margin-bottom:240px;" />

<div id="grid"></div>
<script>
var dataSource = new kendo.data.DataSource({
transport: {
read: {
url: "https://ndpapi.azurewebsites.net/api/v/threads/active/5",
dataType: "jsonp",
type: 'GET'
},
parameterMap: function (options, type) {
if (type == "read") {
return {
n: options.page,
s: options.take
}
}
}
},
schema: {
total: "total",
data: "d",
model: {
id: "t_id",
fields: {
t_id: { type: "number" },
thread_title: { type: "string" },
thread_body: { type: "string" },
thread_created_dt: { type: "date" },
thread_edited_dt: { type: "date", nullable: true },
up_count: { type: "number" },
down_count: { type: "number" },
posts_count: { type: "number" },
posts_last_dt: { type: "date", nullable: true },
posts_first_dt: { type: "date", nullable: true },
u_id: { type: "number" },
username: { type: "string" },
tagline: { type: "string", nullable: true },
url: { type: "string", nullable: true },
user_created_dt: { type: "date", nullable: true },
ranking: { type: "number" }
}
}
},
pageSize: 2,
serverPaging: true,
serverFiltering: false,
serverSorting: false
});
$('#grid').kendoGrid({
dataSource: dataSource,
height: 800,
//toolbar: ["create", "delete", "update"],
filterable: false,
sortable: false,
pageable: {
refresh: true,
//buttonCount: 10,
//type: 'numeric',
pageSizes: true,
//pageSizes: [1, 2, 4, "all"],
info: true,
numeric: true,
previousNext: true
},
columns: [
{
field: "ranking",
title: "Rank",
format: "{0: #) }",
headerAttributes: {
style: "font-weight: bold; text-align: center; font-size: 10px"
},
width: "40px"
},
{
field: "thread_title",
title: "Thread",
headerAttributes: {
style: "font-weight: bold; text-align: center; font-size: 10px"
},
width: "120px"
},
{
field: "thread_body",
title: "Body",
headerAttributes: {
style: "font-weight: bold; text-align: center; font-size: 10px"
},
width: "240px"
},
{
field: "up_count",
title: "+Votes",
headerAttributes: {
style: "font-weight: bold; text-align: center; font-size: 10px"
},
width: "40px"
},
{
field: "down_count",
title: "-Votes",
headerAttributes: {
style: "font-weight: bold; text-align: center; font-size: 10px"
},
width: "40px"
},
{
field: "posts_count",
title: "Posts",
headerAttributes: {
style: "font-weight: bold; text-align: center; font-size: 10px"
},
width: "40px"
}]
});
</script>
</body>

Grid

answered on 25 Apr 2018

2 answers

99 views

Page reloads when trying to expand row

Hello

I have a page with a kendoGrid that uses detail rows. The page works perfectly fine when I include all the javascript using script tags but I'm trying to move everything into webpack. Now everything looks correct but clicking a row just refreshes the page. It seems that kendo isn't registering a click event on the .k-icon anchors in the grid.I also have comboboxes and a chart on the page and the click events work on them.

I've spent a lot of time trying to debug this but I don't see any errors or warnings. Any help would be appreciated.

Grid

answered on 25 Apr 2018

1 answer

145 views

jQuery inside a tooltip

We have a kendo tooltip which loads content (a cshtml partial) via ajax. But it seems as though that partial doesn't have access to jQuery.

We get the old classic "$ is not a function" message in the browser console.

Is this a known issue? Is there a workaround?

To be specific, we want to host another tooltip from an object within the first tooltip.

Thanks,

George

ToolTip

answered on 25 Apr 2018

3 answers

2.0K+ views

ComboBox read data

I have a Kendo UI ComboBox with dynamic data from a server (>1000 objects).

The following restricts should apply to the control:

1) It should only load data when interacted with.

2) It should always return the first 20 object when the dropdown box is clicked

3) Filtering should work and return objects from the server that match the filter

4) An object might be added to the combobox when the page is loaded

My problem right now is that if I add an item to the dataSource on page load, the combobox will not trigger a read. Adding a binding to dropdown read will sometimes trigger read 2 times entailing flicker and weird behavior.

I have created a example here: https://dojo.telerik.com/ATEWEmuz/4

How do I make it so the combobox always trigger a read when the user click on the down arrow?

ComboBox