Questions on Kendo UI for jQuery Forum

2 answers

782 views

Remove() function firing Destroy event after Drag & Drop

I am able to add rows, delete rows, and update my Kendo Grid via the CRUD operations in my controller. The issue I am having is that whenever I use the following drag and drop function the "remove()" triggers the Destroy event in my controller which deletes the row that was inserted and this is not what I am looking to do. The delete button is located in a column and only when this button is clicked do I want to trigger the Destroy event. My grid is editable and fully functional besides this issue which I have already spent a good amount of time trying to troubleshoot. Any help or work around for this matter would be greatly appreciated.

function onChange(e) {

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

var oldIndex = e.oldIndex;
var newIndex = e.newIndex;
var data = grid.dataSource.data();
var dataItem = grid.dataSource.getByUid(e.item.data("uid"));
var numRows = grid.dataSource.view().length; //total # of rows

grid.dataSource.remove(dataItem); // <--- This is the line triggering the Destroy event.

grid.dataSource.insert(newIndex, dataItem);
}

Grid

answered on 25 Feb 2015

3 answers

252 views

angularjs class diretive attach click event to Kedno UI grid

I am trying to use class directive to attach click event to the next page button on the kendo grid.

Directive:

.directive('kPagerNav', function () {
return {
restrict: 'C',
controller: function ($scope, $element, $attrs, $location) {

if (typeof $scope.testFunc === "function") {
$element.click(function () {
$scope.testFunc();
});
}
}
}
})

Example
http://dojo.telerik.com/AKiqO

I have exactly the same directive working for a 'cancel changes' button , but I can't get next page click working.

Grid

answered on 25 Feb 2015

1 answer

179 views

Editing KendoUI Grid within Sitefinity

Iam building an application using the combination of MVC - KendoUI widgets - Sitefinity
the problem is Iam not able to retrieve records to the grid from the data source at all
while using the same code out of sitefinity within Visual Studio - MVC - KendoUI is working fine
Thanks

MVVM

answered on 25 Feb 2015

4 answers

172 views

First click on Splitter widget causes scrolling

Greetings,

When my browser window is small enough that the entire (horizontal) Splitter doesn't fit on screen, clicking the Splitter's collapse/expand thumb (handle) causes the window to scroll up to a point where the top of the Splitter is at the top of the screen. Then clicking again causes the expected collapse/expand behavior. I have a feeling that this may not be specifically a Splitter issue but it is the only place I have seen it. To me this is a very annoying behavior and it makes my users think the Splitter is not working correctly. Can anyone suggest a way to suppress the scrolling and get the click event straight to the Splitter?

Thanks,
Will

Splitter

answered on 25 Feb 2015

1 answer

85 views

Grid with virtual scrolling gets stuck forever if there is a transport error

If you have a Grid with virtual scrolling enabled, and it has a bad transport read while scrolling (eg mangled JSON response), then it just shows the loading bar forever and becomes completely stuck. It does also not call any of the appropriate error handling methods.

This is because DataSource.prefetch does not provide an error handler for its transport.read call. So if the transport fails, the DataSource just sits there forever thinking that the request is still outstanding.

On the other hand DataSource.read works as expected, as it provides an error handler to transport.read that cancels the request and raises the appropriate error events. However the issue is that virtual scrolling bypasses DataSource.read.

regards,
Rowan

Grid

answered on 25 Feb 2015

2 answers

281 views

Connecting to local data file for grid not working

I'm trying to connect to my local JSON file, but it's not working. I thought I'd start with the basics and copy the demo XML to a local file, but that's still not working. Just wondering if anyone can spot why it won't work locally? I'm using the basic grid setup code.

$("#grid").kendoGrid({
dataSource: {
type: "odata",
transport: {
read: "app/js/swagger-test.xml"
},
pageSize: 20
},
height: 550,
groupable: true,
sortable: true,
pageable: {
refresh: true,
pageSizes: true,
buttonCount: 5
},
columns: [{
field: "ContactName",
title: "Contact Name",
width: 200
}, {
field: "ContactTitle",
title: "Contact Title"
}, {
field: "CompanyName",
title: "Company Name"
}, {
field: "Country",
width: 150
}]
});

There are no errors showing, but neither is the data. If I change it to point to my JSON file and change the type to json, I get an undefined error.

Thanks for any help.

Data Source

answered on 25 Feb 2015

11 answers

788 views

[Solved] Compare data in multiple selected rows?

Hi! I need to compare the data in a specific field in selected rows in order to disable/enable some external buttons. Initially, I only needed to enable the buttons based on whether rows were selected or not, so it was pretty trivial:

1.if (selected.length == 0) {

2.$('#fancyButton1, #fancyButton2').attr('disabled', 'disabled');

3.} else if (selected.length > 0) {

4.$('#fancyButton1, #fancyButton2').attr('disabled', false);

5.}

Now, I need to compare the numeric values in a specific field, and if they are all equal, THEN enable the buttons.. can someone provide an example?

Grid

answered on 25 Feb 2015

1 answer

335 views

manipulating the data

I have a data source that returns data from a remove source (data = [{"i":27,"p":10,"o":"Yes"},{"i":29,"p":0,"o":"No"},{"i":30,"p":10,"o":"Yes"},{"i":31,"p":10,"o":"Yes"},{"i":32,"p":10,"o":"Yes"},{"i":33,"p":10,"o":"Yes"},{"i":35,"p":10,"o":"Yes"},{"i":37,"p":0,"o":"No"},{"i":38,"p":0,"o":"No"}...).

On the client side I'd like to filter, group and sum/count the data in various ways fx:

filter: i = 32
group by: o
sum p

is this possible using only datasouce methods?
or should I look into using another js framework like underscore.js?

http://jsbin.com/tosito/2/edit?js,console,output

Data Source

answered on 25 Feb 2015

1 answer

95 views

manipulating the data

A datasouce returns this data: [{"i":27,"p":10,"o":"Yes"},{"i":29,"p":0,"o":"No"},{"i":30,"p":10,"o":"Yes"},{"i":31,"p":10,"o":"Yes"},{"i":32,"p":10,"o":"Yes"},{"i":33,"p":10,"o":"Yes"},{"i":35,"p":10,"o":"Yes"},{"i":37,"p":0,"o":"No"},{"i":38,"p":0,"o":"No"}...

http://jsbin.com/tosito/2/edit?js,console,output

I'd like to query and aggregate data in various ways on the client: like "where i = 33 group by o sum p".

Is this possible using datasource methods only?
Or should I be using another framework like underscore.js?

/Morten

Data Source

answered on 25 Feb 2015

5 answers

535 views

AngularJS Detail Grid with Dynamic Columns

Good morning,

I'm looking for a suggestion of how to approach the following situation:

- Editable AngularJS Grid (with dynamically created columns based on server response...use the k-ng-delay to delay until columns built) (this works fine)
- Editable Detail Grid with dynamically created columns based on a server response

Previously we were using the standard template approach based on the detailInit and detailTemplate as specified in this demo: http://demos.telerik.com/kendo-ui/grid/detailtemplate. Our template had angular directives to disable buttons, etc. and we would not attach the detail grid until the columns were built based on data from the server.

All this worked fine until upgrading from V2014.2.1008 to V2014.3.1411. After this upgrade, when an edit was made to the detail grid data, the angular directives no longer got fired unless we force a $apply based on some other event or we click to edit a field in the master row.

We started adjusting our detail grid to follow the more-angular approach as specified here, http://demos.telerik.com/kendo-ui/grid/angular, but not sure how to delay binding as the k-ng-delay and k-rebind don't make sense in this context.

Any suggestions on how to follow this approach?

Thanks,
Chuck

Grid

answered on 25 Feb 2015