kendo grid cancelChanges issue - javascript

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.

Related

Sitecore 8 Speak UI QueryDataSource in Javascript

I am trying to access QueryDatasource results in Javascript. Everything is setup correctly. I get the items by using
var destData = this.regionQueryDatasource.get("items");
My issue is that,
I want to get those items on page load. I put this code inside initialize() then it doesn't return anything. If I call it in some button click function, then it returns data.
initialized: function () {
var destData = this.regionQueryDatasource.get("items");},
I want the querying to happen in synchronous manner. Sometimes, the items are returned as empty. I want to wait till the items are loaded.
Any help would be great. Thanks in advance!
Have you tried refreshing the DataSource before calling Get items?
E.g
this.regionQueryDatasource.refresh()
Then you can check viewModel.hasItems()
Id recommend using this.regionQueryDatasource.viewModel.items() rather than this.regionQueryDatasource.get("items");

Lightswitch - Passing Paramaters in the HTML Client

ive been trying for ages now to pass the value with little success, the image below is what I am aiming for:
and this is the table structure/relationships
cheers for any help you can give me guys, this is beginning to be a real pain in the arse
based on this I managed to solve my issue by doing the following
LightSwitch: Passing data from one screen to another -> for Desktop Client
For HTML Client
You MUST have a parameter on the screen from which you are passing the data, this is done by creating a data item, i.e. int in the below example, and in the post render code for this use the following code:
myapp.ViewDeliveryNote.DeliveryIDPass_postRender = function (element, contentItem) {
contentItem.screen.DeliveryIDPass = //created parameter
contentItem.screen.DeliveryNote.DeliveryID; //the unique ID from the screen
};
On the screen you want to pass to, add a new data item as that datatype OR if you are using it as a search parameter, use this.
Find the parameter/data item you added on the left hand panel and click on the item, now in the properties window tick (is parameter)
If there was a previous link between the pages via a button, remove the on tap and re-add it... you will now see an additional box where the application is asking for the value to pass, select the one you want and that shoud work :)
hope this helps

jquery footable $('#classes').trigger('footable_redraw'); return hidden table

this is my first Question, may be hard to understand.
calling $('#classes').trigger('footable_redraw'); , it return the data but hide the table heading and data rows,but when i used $('#classes').trigger('footable_initialize'); its work fine but reduplicate the data .
Ajax method is called on submitting form.
$.ajax({
url : baseurl+'index.php/settings/classes/viewclasses',
success : function(data) {
$('.classestbody').append(data);
$('#classes').trigger('footable_redraw'); }
});
How can i only get my updated data in table after saving any Values by calling submitting for saving ?
Basically you need to check to see if the data is in the table already. If the data is not in the table, add it; if it is in the table, don't. You'll need some way to positively identify a row that matches the data. If data is an array, you'll need to loop through the array and check each row.
Another option would be to use a data binding framework. This would allow you to bind the data to the table, then you just add/update/delete rows from the data and the framework takes care of updating the table (view) for you.
I personally use Knockout.js. They have a really good tutorial: http://learn.knockoutjs.com/. Even if you don't end up using Knockout.js, I think the tutorial is pretty cool and it will only take you a couple of hours to go through all of them.
If your script on index.php/settings/classes/viewclasses always returns the hole table, and since you said the data gets duplicated this seems to be the case.
Then it is easier to delete all rows then add them all again, just add $('.classestbody').empty(); before $('.classestbody').append(data);. Your code would look like this:
$.ajax({
url : baseurl+'index.php/settings/classes/viewclasses',
success : function(data) {
$('.classestbody').empty();
$('.classestbody').append(data);
$('#classes').trigger('footable_redraw');
}
});

Kendo DataSource Transport.Destroy with function got called too much

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#/

How do I load data for Dojo Dgrid Table using AJAX?

I am exploring using DGrid for my web application. I am trying to have a table similar to this.
The code for the example above is here.
The table uses a memory store as the source of its data - the summary field there is what shows up when we click and expand each row.
I want the details(i.e the text shown when we click a row) to be fetched from the server on clicking on the row instead of being statically loaded along with rest of the page.
How do I modify the above code to be able to do that?
(My requirement is that of an HTML table, each row expandable on clicking, where the data on each expansion is fetched from the server, using AJAX for instance. I am just exploring dgrid as an option, as I get sortable columns for free with dgrid. If there is a better option, please let me know)
EDIT: Basically I am looking for ideas for doing that and not expecting anyone to actually give me the code. Being rather unfamiliar with Dojo, I am not sure what would be the right approach
If your ajax call returns html, you could place a dijit/layout/ContentPane in your renderer, and set the url of the contents you want to fetch in the ContentPane's href property. Assuming that your initial data (the equivalent of the example's memory store) would have a property called "yourServiceCallHref" containing the url you want to lazy load, your could try this :
require(["dijit/layout/ContentPane", ...], function(ContentPane){
renderers = {
...,
table: function(obj, options){
var div = put("div.collapsed", Grid.prototype.renderRow.apply(this, arguments)),
cp = new ContentPane({
href : obj.yourServiceCallHref
}),
expando = put(div, "div.expando", cp.domNode);
cp.startup();
return div;
}
});
If your service returns json, you could probably do something with dojo/request in a similar fashion. Just add your dom creation steps in your request callback and put them inside the div called "expando"...
Another option would be to replace the Memory store by a JsonRest store, and have the server output the same json format than the one you see on the Memory store. That means all the data would be fetched in a single call though...

Categories