I have an issue when I want to delete multiple items from a store without having to refresh my page. The first time I delete an event, all is well as you can see from this Fiddle snippet:
551 200 HTTP localhost:52543 /api/Appointments/Destroy?_dc=1442940419083 140 no-cache; Expires: -1 application/json; charset=utf-8 chrome:157528
Data:
{ "Id":1749644,"StartDate":"2015-09-22T01:00:00+02:00","EndDate":"2015-09-22T03:00:00+02:00","ResourceId":9,"PreviousResourceId":0,"Name":"","Cls":""}
However, if I want to remove additional items subsequently (without refreshing the page), it is as though the event store does not accept or understand that the previously removed record is already processed:
[
{ Id":1749644,"StartDate":"2015-09-22T01:00:00+02:00","EndDate":"2015-09-22T03:00:00+02:00","ResourceId":9,"PreviousResourceId":0,"Name":"","Cls":""},
{"Id":1749656,"StartDate":"2015-09-22T10:45:00+02:00","EndDate":"2015-09-23T16:00:00+02:00","ResourceId":20,"PreviousResourceId":0,"Name":"test","Cls":""}
]
If you look closely, you'll see the same event appears too in the second call whereas this shouldn't! Apart from this, everything goes perfectly: the Web API is called after every 1 destroy call (thus first time after every page request). After the first call, the Web API is still called but the binding is now corrupted due to unexpected input: it receives a collection whereas it expects only 1 item.
Here is the tore:
Ext.define('SchedulerApp.store.EventStore', {
extend: "Sch.data.EventStore",
autosync: true,
batch: false,
proxy: {
type: 'ajax',
api: {
create: '/api/Appointments/Add',
update: '/api/Appointments/Update',
destroy: '/api/Appointments/Destroy'
},
reader: {
type: 'json'
},
writer: {
type: 'json',
writeAllFields: true
}
},
listeners: {
load: {
fn: function (store, records, successfull) {
}
},
create: {
fn: function (store, records, successfull) {
}
},
add: {
fn: function (store, records, successfull) {
//store.sync();
}
},
update: {
fn: function (store, records, successfull) {
var previousResource = records.previous.ResourceId;
records.data.PreviousResourceId = previousResource;
records.store.sync();
}
},
destroy: {
fn: function (store, records, successfull) {
}
},
remove: {
fn: function (store, records, successfull) {
store.sync();
}
}
}
});
I need to figure out how to 'accept' an updated/inserted/removed record. This is a fairly standalone issue, so every other code than posted here will be useless information.
Turns out I indeed missed the store's commitment function. In the callback's success method, I added the commit and the issue disappeared!
Related
I have made custom workflow activity, registered it with Plugin Registration Tool and now i want to execute it using Action. Action wont have input/output parameters. Unique name is ad_opportunity. It will be executed from Custom Entity ad_productsamplerequest
I will call this action from JavaScript using Process.js.
I am not familiar with Process.js, so I have a problem to make Action call.
Here is the call I made, but it doesn't work. Am I missing something here:
Process.callAction("ad_opportunity",
[{
key: "Target",
type: Process.Type.EntityReference,
value: { id: Xrm.Page.data.entity.getId(), entityType: "ad_productsamplerequest" }
}],
function (params) {
//Success
},
function (e) {
// Error
alert(e);
}
);
Value mentioned in your code should be declared as EntityReference. Please refer below code for same
Process.callAction("mag_Retrieve",
[{
key: "Target",
type: Process.Type.EntityReference,
value: new Process.EntityReference("account", Xrm.Page.data.entity.getId())
},
{
key: "ColumnSet",
type: Process.Type.String,
value: "name, statuscode"
}],
function (params) {
// Success
},
function (e, t) {
// Error
});
Rest looks good
The previous version was incorrect. My apologies.
I'm trying to load a store from the server with some parameters.
onSave: function (cmp) {
var vm = cmp.up('stageform').getViewModel();
vm.set("extraParams", {applicationFormId: 1});
var store = vm.getStore("applicationForms");
console.log(store);
}
vm.getStore("applicationForms"); returns null when the event is fired the first time, after that it returns the actual instance of the store.
Why do I get such a strange behavior? And is this the proper way of loading data from the server?
ViewModel Code:
Ext.define('CPCApplication.view.cases.ApplicationFormModel', {
.....
stores: {
applicationForms: {
model: 'CPCApplication.model.ApplicationForm',
autoLoad: true,
proxy: {
type: 'ajax',
extraParams: '{extraParams}',
autoload: true,
url: ...,
reader: {
type: 'json'
}
},
}
}
});
There is no obvious error in the code you posted. I only not quite sure when you call getStore. That can be important because view model exists only together with its view, binding is asynchronous, etc. Thus, it may be (theoretically) that the store really does not yet exist the first time.
Ideally, prepare a showcase and post it to https://fiddle.sencha.com. Then it would be possible to sort out if it is a problem in your app or in Ext. (Btw, which version?)
I have the following models in my Sailsjs application with a many-to-many relationship:
event.js:
attributes: {
title : { type: 'string', required: true },
description : { type: 'string', required: true },
location : { type: 'string', required: true },
maxMembers : { type: 'integer', required: true },
currentMembers : { collection: 'user', via: 'eventsAttending', dominant: true },
creator : { model: 'user', required: true },
invitations : { collection: 'invitation', via: 'eventID' },
tags : { collection: 'tag', via: 'taggedEvents', dominant: true },
lat : { type: 'float' },
lon : { type: 'float' },
},
tags.js:
attributes: {
tagName : { type: 'string', unique: true, required: true },
taggedEvents : { collection: 'event', via: 'tags' },
},
Based on the documentation, this relationship looks correct. I have the following method in tag.js that accepts an array of tag strings, and an event id, and is supposed to add or remove the tags that were passed in:
modifyTags: function (tags, eventId) {
var tagRecords = [];
_.forEach(tags, function(tag) {
Tag.findOrCreate({tagName: tag}, {tagName: tag}, function (error, result) {
tagRecords.push({id: result.id})
})
})
Event.findOneById(eventId).populate('tags').exec(function(error, event){
console.log(event)
var currentTags = event.tags;
console.log(currentTags)
delete currentTags.add;
delete currentTags.remove;
if (currentTags.length > 0) {
currentTags = _.pluck(currentTags, 'id');
}
var modifiedTags = _.pluck(tagRecords, 'id');
var tagsToAdd = _.difference(modifiedTags, currentTags);
var tagsToRemove = _.difference(currentTags, modifiedTags);
console.log('current', currentTags)
console.log('remove', tagsToRemove)
console.log('add', tagsToAdd)
if (tagsToAdd.length > 0) {
_.forEach(tagsToAdd, function (tag) {
event.tags.add(tag);
})
event.save(console.log)
}
if (tagsToRemove.length > 0) {
_.forEach(tagsToRemove, function (tagId) {
event.tags.remove(tagId)
})
event.save()
}
})
}
This is how the method is called from the event model:
afterCreate: function(record, next) {
Tag.modifyTags(tags, record.id)
next();
}
When I post to event/create, I get this result: http://pastebin.com/PMiqBbfR.
It looks as if the method call itself is looped over, rather than just the tagsToAdd or tagsToRemove array. Whats more confusing is that at the end, in the last log of the event, it looks like the event has the correct tags. When I then post to event/1, however, the tags array is empty. I've also tried saving immediately after each .add(), but still get similar results.
Ideally, I'd like to loop over both the tagsToAdd and tagsToRemove arrays, modify their ids in the model's collection, and then call .save() once on the model.
I have spent a ton of time trying to debug this, so any help would be greatly appreciated!
There are a few problems with your implementation, but the main issue is that you're treating certain methods--namely .save() and .findOrCreate as synchronous methods, when they are (like all Waterline methods) asynchronous, requiring a callback. So you're effectively running a bunch of code in parallel and not waiting for it to finish before returning.
Also, since it seems like what you're trying to do is replace the current event tags with this new list, the method you came up with is a bit over-engineered--you don't need to use event.tags.add and event.tags.remove. You can just use plain old update.
So you could probably rewrite the modifyTags method as:
modifyTags: function (tags, eventId, mainCb) {
// Asynchronously transform the `tags` array into an array of Tag records
async.map(tags, function(tag, cb) {
// For each tag, find or create a new record.
// Since the async.map `cb` argument expects a function with
// the standard (error, result) node signature, this will add
// the new (or existing) Tag instance to the resulting array.
// If an error occurs, async.map will exit early and call the
// "done()" function below
Tag.findOrCreate({tagName: tag}, {tagName: tag}, cb);
}, function done (err, tagRecords) {
if (err) {return mainCb(err);}
// Update the event with the new tags
Event.update({id: eventId}, {tags: tagRecords}).exec(mainCb);
});
}
See the full docs for async.map here.
If you wanted to stick with your implementation using .add and .remove, you would still want to use async.map, and do the rest of your logic in the done method. You don't need two .save calls; just do run all the .add and .remove code first, then do a single .save(mainCb) to finish it off.
And I don't know what you're trying to accomplish by deleting the .add and .remove methods from currentTags (which is a direct reference to event.tags), but it won't work and will just cause confusion later!
I created a model like
Ext.define('MyApp.model.ContainerDetailsModel', {
extend: 'Ext.data.Model',
alias: 'model.ContainerDetailsModel',
config: {
fields: [
{
name: 'id',
allowNull: false,
type: 'string'
},
{
name: 'container_types_id',
type: 'string'
}
]
}
});
and a store like this
Ext.define('MyApp.store.ContainerDetailsStore', {
extend: 'Ext.data.Store',
requires: [
'MyApp.model.ContainerDetailsModel'
],
config: {
model: 'MyApp.model.ContainerDetailsModel',
storeId: 'ContainerDetailsStore',
proxy: {
type: 'ajax',
enablePagingParams: false,
url: 'hereIsServiceUrl',
reader: {
type: 'json'
}
}
}
});
Now somewhere in application I tried to get one record like:
var detailsStore = Ext.getStore("ContainerDetailsStore");
detailsStore.load();
var detailsRecord = detailsStore.last();
But it gaves me undefined. The json returned by service is ok, it use it in different place as source for list. I already tried to change allowNull to true, but there is no null id in source. I tried set types to 'int' with the same result.
So I have tried
console.log(detailsStore);
Result is like this (just important values):
Class {
...
loaded: true,
data: Class {
...
all: Array[1] {
length: 1,
0: Class {
container_types_id: "1",
id: "726",
....
}
...
}
...
},
...
}
In the same place
console.log(detailsStore.data);
returns (as it should):
Class {
...
all: Array[1] {
length: 1,
0: Class {
container_types_id: "1",
id: "726",
....
}
...
}
but (next line)
console.log(detailsStore.data.all);
returns
[]
And it's empty array. When i try any methods from the store it says the store is empty.
I wrote console.log() lines one after another - so for sure it doesn't change between them (I try it also in different order or combinations).
My browser is Google Chrome 23.0.1271.97 m
I use Sencha from https://extjs.cachefly.net/touch/sencha-touch-2.0.1.1/sencha-touch-all-debug.js
How can I take a record from that store?
store.load() Loads data into the Store via the configured proxy. This uses the Proxy to make an asynchronous call to whatever storage backend the Proxy uses, automatically adding the retrieved instances into the Store and calling an optional callback if required. The method, however, returns before the datais fetched. Hence the callback function, to execute logic which manipulates the new data in the store.
Try,
detailsStore.load({
callback: function(records, operation, success) {
var detailsRecord = detailsStore.last();
},
scope: this
});
I created a Grid component with the store configuration like this:
//Create the store
config.store = new Ext.data.Store({
restful: true,
autoSave: false,
batch: true,
writer: new Ext.data.JsonWriter({
encode: false
}),
reader: new Ext.data.JsonReader({
totalProperty: 'total',
root: 'data',
fields: cfg.fields
}),
proxy: new Ext.data.HttpProxy({
url:cfg.rest,
listeners:{
exception: {
fn: function(proxy, type, action, options, response, arg) {
this.fireEvent('exception', proxy, type, action, options, response, arg);
},
scope: this
}
}
}),
remoteSort: true,
successProperty: 'success',
baseParams: {
start: 0,
limit: cfg.pageSize || 15
},
autoLoad: true,
listeners: {
load: {
fn: function() {
this.el.unmask();
},
scope: this
},
beforeload: {
fn: function() {
this.el.mask("Working");
},
scope: this
},
save: {
fn: function(store, batch, data) {
this.el.unmask();
this.fireEvent('save', store, batch, data);
},
scope: this
},
beforewrite: {
fn: function(){
this.el.mask("Working...");
},
scope: this
}
}
});
Note: Ignore the fireEvents. This store is being configured in a shared custom Grid Component.
However, I have one problem here: Whatever CRUD actions I did, I always come out with N requests to the server which is equal to N rows I selected. i.e., if I select 10 rows and hit Delete, 10 DELETE requests will be made to the server.
For example, this is how I delete records:
/**
* Call this to delete selected items. No confirmation needed
*/
_deleteSelectedItems: function() {
var selections = this.getSelectionModel().getSelections();
if (selections.length > 0) {
this.store.remove(selections);
}
this.store.save();
this.store.reload();
},
Note: The scope of "this" is a Grid Component.
So, is it suppose to be like that? Or my configuration problem?
I'm using Extjs 3.3.1, and according to the documentation of batch under Ext.data.Store,
If Store is RESTful, the DataProxy is also RESTful, and a unique transaction is generated for each record.
I wish this is my configuration problem.
Note: I tried with listful, encode, writeAllFields, encodeDelete in Ext.data.JsonWriter... with no hope
Just for those who might wonder why it's not batch:
As for the documentation stated,
If Store is RESTful, the DataProxy is also RESTful, and a unique transaction is generated for each record.
Which is true if you look into the source code of Ext.data.Store in /src/data/Store.js
Line 309, in #constructor
// If Store is RESTful, so too is the DataProxy
if (this.restful === true && this.proxy) {
// When operating RESTfully, a unique transaction is generated for each record.
// TODO might want to allow implemention of faux REST where batch is possible using RESTful routes only.
this.batch = false;
Ext.data.Api.restify(this.proxy);
}
And so this is why I realize when I use restful, my batch will never get changed to true.
You read the docs correctly; it is supposed to work that way. It's something to consider whenever choosing whether to use RESTful stores on your grids. If you're going to need batch operations, RESTful stores are not your friends. Sorry.