Kendo DataSource Transport.Destroy with function got called too much - javascript

I've got a strange problem using transport.destroy:
I have a Listview with a swipe event to open the delete option. (like most apps)
i did implement this: http://demos.kendoui.com/mobile/listview/editing.html#/ in my app.
everything work fine, except destroy am listview item will be called for X+1 (x = deleted items)
At first deletion it will be called once, at the 2nd time it will be called twice and so on.
Here is the JSBin: http://jsbin.com/AGAGUfE/11/
You can see it within the console for each delete you will receive an addition call.
Do you see where en error could be?

The problem is that you are not saying that the destroy succeeded (options.success();)so next time that you invoke a delete it will try to delete again previous records.
Try destroy as:
destroy: function (options) {
console.log("1");
movies.splice(options.data.ProductID, 1);
options.success();
}
Try it here : http://jsbin.com/AGAGUfE/14#/

Related

How to define where function is slows down?

I have report view where a bunch of controls located, there is an example code:
#Html.DevExpress().DropDownEdit(
settings =>{
settings.Name = "SomeList";
settings.Width = 100;
settings.SetDropDownWindowTemplateContent(c =>{
#Html.DevExpress().ListBox(
...
).BindList(ViewData["SomeList"]).Render();
some code...
).GetHtml()
When it render first time it works fine, but in business logic there is another drop down let's call it dropdown #2. When user select some values in dropdown#2 JS handle this action send request to the server to get actual value for first dropdown, then clear all rendered values from dropdown #1 and insert new items.
And problem in performance lies in how devexpress create new items on client side. From backend there is now 8000 new items can be added to dropdown #1 and it keep growing. And user must wait 5-10 seconds when browser render it. I tried to research what is happening when new item is creating but there are a lot of devexpress function which call another functions.
JS code look's like:
SomeList.BeginUpdate();
l = data.SomeList.length;
while (x < l) {
SomeList.AddItem(data.SomeList[x].Name, data.SomeList[x].Id);
x++;
}
SomeList.EndUpdate();
BeginUpdate and EndUpdate is devexpress functions that prohibbit browser render control while adding new items. Without this function it takes eternity to finish adding new items.
I know start point of problem it is - item creating code SomeList.AddItem(...).
So my question: is there way to do something like console.trace(SomeList.AddItem(...)) and see full trace which will be executed on first code pass?
Also is there way to determine which function call take alot of time to execute?

Firebase Database - Strange error when creating and removing nodes (Javascript)

I have two Firebase queries, one for adding an ID to a node (named blocklist) and one for deleting an ID from the same node.
They are each triggered by one of two buttons: a "Block" button and an "Unblock" button.
These are the functions:
function blockUser(){
// friendToBlock is the ID I want to add to the block list:
var friendToBlock = document.getElementById('hiddenUid').innerHTML;
// globaluid is the currently logged in user's ID:
firebase.database().ref('users/'+globaluid+'/blocklist/').push({
blockedId:friendToBlock
});
console.log(friendToBlock+" is now blocked!");
}
function unblockUser(){
// friendToUnblock is the ID I want to remove from the block list:
var friendToUnblock = document.getElementById('hiddenUid').innerHTML;
var blockedRef = firebase.database().ref('users/'+globaluid+'/blocklist/');
var blockedQuery = blockedRef.orderByChild('blockedId').equalTo(friendToUnblock);
blockedQuery.on('child_added', function(blockedSnapshot) {
blockedSnapshot.ref.remove(function (error) {
if (!error) {
console.log(friendToUnblock+" should now be unblocked.");
}
});
});
}
These two functions are working perfectly the first time I run the app, however if I click "Block", "Unblock" and then "Block" again, the second Block event triggers both functions for some reason.
I have the Firebase console open and can see the blocklist node being created and then immediately being deleted half a second later, which means that the "Block" button is triggering both functions.
For some reason this doesn't happen the first time I press the buttons after opening the app, it only occurs when pressing the "Block" button after pressing the "Unblock" button.
I can't figure out what could be wrong with my code, I am wondering does Firebase have a limit on how fast you can create a node after deleting an identically-named node in the database?
I'd really appreciate any help or advice on this, thanks in advance!
After working on this a bit longer I've been able to fix it.
I think the problem was being caused by the line:
blockedQuery.on('child_added', function(blockedSnapshot) ...
It seems that this continued to listen and get triggered whenever the blocklist node was recreated by blockUser();.
I changed it to:
blockedQuery.once('value', function(blockedSnapshot) ...
And now it's adding and removing the blocklist node correctly with no errors.

How to get notified when grid changed in AngularJS ui-grid?

If there is a way in ui-grid that I can know a grid is finish updating the rows?(like a filter is being applied etc)? I want to run some function after the grid view changes.
I tried the following method:
$scope.filteredRows = $scope.gridApi.core.getVisibleRows($scope.gridApi.grid);
$scope.$watch('filteredRows', function(){console.log('view updated');});
The above approach works when the grid just finish initiating, after that, it won't work anymore.
I also tried using the filterChanged api:
$scope.gridApi.core.on.filterChanged($scope, function() {
console.log('filter changed');
foo();
});
The problem with this method is that although I can get notified when the filter is changed, but if the grid is very large, it needs some time to finish updating the view, and before that, the function foo() is being called before the grid update is finished.
Any idea will be appreciated.
I've seen use of $scope.grid.api.core.on.rowsRendered( $scope, $scope.col.updateAggregationValue ); in ui-grid-footer-cell.js. I'm not sure exactly when rowsRendered fires, but given it's being used to calculate aggregations and aggregations require knowledge whenever the rows are changed, and must run after the rowsProcessors finish running, there's a good chance that it's what you want.
EDIT: the framework to use it would be:
Define a function that you want to call when the visible rows have changed
var myFunction = function() {
do some stuff
};
Set this function to be called whenever rows are rendered
$scope.gridApi.core.on.rowsRendered( $scope, myFunction );
Well, I found a workaround, in order to call the function after the grid is updated, which takes some time, I added a delay in filterChanged event:
$scope.gridApi.core.on.filterChanged($scope, function() {
console.log('filter changed');
$timeout(foo(),800);
});
To use the $timeout, you need to add that to your controller first.

Chrome Extension Notifications Not Always Created - Reuse?

Let's say I want to show the same notification each time something happens. That's what I currently use:
chrome.notifications.create(id, {
type:"basic",
title:"Title",
message:"My message",
iconUrl: "icon.png",
}, notificationResult);
But sometimes the notification doesn't appear.
Is that an id thing ? Do I need to reuse an already created notification ? Can I not create a new notification with the same id ?
I tried to do a var notification = chrome.notifications.create(id .... ) and do a notification.show() in case I already created one with the same id but that also didn't solve it.
So - do I need to recreate an existing notification each time I want to show the same one (which currently doesn't work for me), or is there a different way? How to make sure it pops every time?
The id in the create function is specifically for reusing. IDs must be unique. If you use create with an ID of an existing notification, it basically behaves like an update.
If a notification exists, it may no longer be shown but only be visible in the Message Center. In this case, the notification IS updated - but not shown again.
The API docs specify that you can pass an empty string to the notification to get a unique new id. If you need it, it is passed to the callback.
But if you do want to reuse the ID (ensuring that the notification is unique), you can use priority trick to make it show again.
You can clear the notification if its not use and if you want to use the same id.
For example :
function Notify(){
var my_notif_id="some_id";
//This will clear your previous notifcation with the same ID
chrome.notifications.clear(my_notif_id,function(){});
chrome.notifications.create(my_notif_id,options,function(){});
}
Now each time you call the notify function to display notification it will clear the old notification before displaying new notification and gets displayed.
UPDATED
As #Xan suggested, Its good to incorporate the create() method inside callback function of clear()
So here is the complete example :
function Notify(id, options){
//This will clear your previous notifcation with the same ID
chrome.notifications.clear(id, function() {
//inside callback function
chrome.notifications.create(id, options, function(){});
});
}

kendo grid cancelChanges issue

I am working on a web application using kendo grid(Angular JS). I should call grid.saveChanges() after every delete or insert operation. But in a special scenario such as
Insert a record and call saveChanges
Then delete the same record and call saveChanges
Then call the call grid.cancelChanges()
Normally it goes back to last saveChanges state but in my case it is showing the deleted row. Any help?
I've tried what you say in this demo: http://demos.telerik.com/kendo-ui/grid/editing but it works correctly.
Maybe it only works when you call saveChanges() manually. Data to restore when you're calling cancelChanges() is stored in _pristineData property so try this workaround:
var grid= $("#YourGrid").data("kendoGrid");
grid.saveChanges();
grid.dataSource._pristineData = grid.dataSource._data;
Finally i got the solution.My issue is related to unique id.After saving the data i have changed the id of grid.dataSource.data() item.Because of that, the mapping between grid.dataSource._pristineData and grid.dataSource._data is broken.So my solution is change the id of grid.dataSource._pristineData also.Now its working.Thank you.

Categories