Sencha Architect - Modify a plugin - extjs

i am currently working with Sencha Touch, Sencha Architect 3,
builded a simple list using a pluing called Pullrefresh:
https://github.com/p5hema2/Sencha-PullRefresh-RefreshFn
I am only able to update records if they are new, but updated and deleted records are on my store, but not updated with my view. So i need to modify my plugin. In Sencha Architect i don't know how to solve that.
Is anyone experienced with that? Modifying plugins
Ext.define('TP.extend.override.PullRefresh', { override: 'Ext.plugin.PullRefresh',
onLatestFetched: function(operation) {
var store = this.getList().getStore(),
oldRecords = store.getData(),
old_length = oldRecords.length,
newRecords = operation.getRecords(),
length = newRecords.length,
toInsert = [],
newRecordIds = [],
oldRecordsArr = [],
toRemove = [],
newRecord, newRecordIndex, oldRecord, i;
for (i = 0; i < length; i++) {
newRecord = newRecords[i];
oldRecord = oldRecords.getByKey(newRecord.getId());
newRecordIds.push(newRecord.getId());
if (oldRecord) {
oldRecord.set(newRecord.getData());
} else {
toInsert.push(newRecord);
}
oldRecord = undefined;
}
store.insert(0, toInsert);
oldRecordsArr = store.getRange();
for (i = 0; i < old_length; i++) {
oldRecord = oldRecordsArr[i];
newRecordIndex = newRecordIds.indexOf(oldRecord.getId());
if (newRecordIndex == undefined || newRecordIndex == -1) {
toRemove.push(oldRecord);
}
oldRecord = undefined;
}
store.remove(toRemove);
}
});
Above example is to update deleted records also.

Related

extjs treenode appendchild not working correctly

I have a treepanel which is loaded on demand from a web rest api. The rest api will return an array with the data according to the id of the selected node. Here is the code:
itemdblclick: function(item, record, eOpts) {
var store = Ext.getStore('mystore');
var newStore = Ext.create('mystore', {
autoDestroy: true,
storeId: 'otherId'
});
var parentid = record.data.id;
var that = this;
newStore.proxy.extraParams = {...};
newStore.autoDestroy = true;
newStore.storeId = 'otherId';
newStore.load({
callback: function(items) {
var node = store.getRootNode().findChild('id', record.data.idelement, true);
for (var i = 0, l = items.length; i < l; i++) {
var item = items[i].data;
var child = {..., idparent: parentid};
var newnode = node.createNode(child);
node.appendChild(newnode, true);
}
node.expand();
}
});
}
Thanks to norbeq who gave me the light to change the id of the second store. The thing is the tree is nicely populated and the node is expanded, but (why there is always a but?) next the expanded node there is no a -, the + remains the same.
This is what I mean:
I've sourrounded in red that the + mark remains and that the folder is still closed.
Also, if I click the + symbol this is what happend:
How can I solve this?
Well, finally I have to say that the official extjs documentation is quite poor for me. I found a solution by test and reading a lot of posts in several foros. I found a solution that might be helpful to others:
var rootNode = store.getRootNode();
for (var i = 0, l = records.length; i < l; i++) {
var x = records[i].data;
var child = { ... };
if (!child.idparent) {
rootNode.appendChild(child);
} else {
var parent = rootNode.findChild('idelement', child.idparent, true);
parent.appendChild(child);
}
if (!child.leaf) {
var node = store.findNode('idelement', child.idelement);
node.set('expanded', true);
}
}
rootNode.set('expanded', true);
That's it

can i override a method defined in node_modules file?

I am using sync Fusion’s React schedule to build a scheduler application using Meteor/React.
In my meteor application, in client/components folder, there lies a file ’schedule.js’.
It has the following piece of code :
function onEventRendered(args) {
categoryColor=args.data.Teacher;
console.log(args.data, );
if (!args.element || !categoryColor) {
return;
}
if (this.currentView === 'Agenda') {
(args.element.firstChild).style.borderLeftColor = categoryColor;
} else {
args.element.style.backgroundColor = categoryColor;
}
}
Whenever onEventRendered triggers, it automatically calls one of the methods that lie in node_modules/ej2-schedule/src/schedule/actions/crud.js
Crud.prototype.addEvent = function (eventData) {
var fields = this.parent.eventFields;
var promise = null;
var editParms = { addedRecords: [], changedRecords: [], deletedRecords: [] };
var args = {
cancel: false,
data: (eventData instanceof Array) ? eventData : [eventData],
requestType: 'eventCreate'
};
this.parent.trigger(events.actionBegin, args);
if (args.cancel) {
return;
}
if (eventData instanceof Array) {
for (var _i = 0, _a = eventData; _i < _a.length; _i++) {
var event_1 = _a[_i];
this.processCrudTimezone(event_1);
editParms.addedRecords.push(event_1);
}
promise =
this.parent.dataModule.dataManager.saveChanges(editParms, fields.id, this.getTable(), this.getQuery());
}
else {
this.processCrudTimezone(eventData);
promise = this.parent.dataModule.dataManager.insert(eventData, this.getTable(), this.getQuery());
}
var crudArgs = { requestType: 'eventCreated', cancel: false, data: eventData, promise: promise };
this.refreshData(crudArgs);
};
I want to just add a line to call a meteor method ‘event.add’ in this method, so that data can be saved in database. How can this be achieved?
We can perform CRUD using MongoDB in our application level without modifying any source file in node_modules. We have prepared a sample for your reference which can be downloaded from the below location.
http://www.syncfusion.com/downloads/support/directtrac/general/ze/Sample1414642222
In the above sample, we have added CRUD actions code snippet in server.js.
app.post("/GetData", (req, res) => { //executes on initial loading and for each CRUD actions
dbo.collection('ScheduleData').find({}).toArray((err, cus) => {
res.send(cus);
});
});
app.post("/BatchData", (req, res) => {
var eventData = [];
if (req.body.action == "insert" || (req.body.action == "batch" && req.body.added.length > 0)) { //this block will execute while adding events
(req.body.action == "insert") ? eventData.push(req.body.value) : eventData = req.body.added;
for (var i = 0; i < eventData.length; i++) {
var sdate = new Date(eventData[i].StartTime);
var edate = new Date(eventData[i].EndTime);
eventData[i].StartTime = (new Date(+sdate - (sdate.getTimezoneOffset() * 60000)));
eventData[i].EndTime = (new Date(+edate - (edate.getTimezoneOffset() * 60000)));
dbo.collection('ScheduleData').insertOne(eventData[i]); //to add the events in MongoDB collection
}
}
if (req.body.action == "update" || (req.body.action == "batch" && req.body.changed.length > 0)) { //this block will execute while editing events
(req.body.action == "update") ? eventData.push(req.body.value) : eventData = req.body.changed;
for (var i = 0; i < eventData.length; i++) {
delete eventData[i]._id;
var sdate = new Date(eventData[i].StartTime);
var edate = new Date(eventData[i].EndTime);
eventData[i].StartTime = (new Date(+sdate - (sdate.getTimezoneOffset() * 60000)));
eventData[i].EndTime = (new Date(+edate - (edate.getTimezoneOffset() * 60000)));
dbo.collection('ScheduleData').updateOne({ "Id": eventData[i].Id }, eventData[i]); //to update the events in MongoDB collection
}
}
if (req.body.action == "remove" || (req.body.action == "batch" && req.body.deleted.length > 0)) { //this block will execute while deleting events
(req.body.action == "remove") ? eventData.push(req.body.value) : eventData = req.body.deleted;
for (var i = 0; i < eventData.length; i++) {
dbo.collection('ScheduleData').deleteOne({ "Id": eventData[i].Id }, eventData[i]); //to delete the events in MongoDB collection
}
}
res.send(req.body);
});
In the below code we have given the GetData and BatchData url path to initial fetching and for performing CRUD actions using UrlAdaptor and assigned it to the scheduler datasource.
let data = new DataManager({ url: 'http://localhost:5000/GetData', crudUrl: 'http://localhost:5000/BatchData', adaptor: new UrlAdaptor, crossDomain: true });
eventSettings={{ dataSource: data }}
Steps to run the sample:
Run MongoDB and create the collection named ‘ScheduleData’ in ‘mydb’ database.
Run the below comments
npm install
npm run server
npm start

AngularJS - Delete check box is not working correctly and only deleting one at a time

I've written out a block of code that allows the user to check or uncheck entities that will be added or removed via web services. My add function seems to be working correctly and provides the ability to add multiple entities. However, my delete function isn't working the same. It doesn't delete each time, and can only delete one at a time. I'm struggling since the code is effectively the same as the add, so I don't know if the issue is AngularJS related or perhaps my web service isn't working correctly.
Edit: I've actually noticed that the for loop goes through it all but doesn't select the correct id, it always starts from the first one.
var toDeleteService = [];
for (var i = 0; i < $scope.siteServices.length; i++) {
if ($scope.siteServices[i].chosen != $scope.siteServices[i].origChosen) {
if ($scope.siteServices[i].chosen == true) {
toAddService.push(i);
}
else {
toDeleteService.push(i);
}
}
}
if (toDeleteService.length > 0) {
var deleteRequest = {};
deleteRequest.services = [];
for (var i = 0; i < toDeleteService.length; i++) {
var parentServiceName = $scope.siteServices[i].parentServiceName;
var j = 0;
for (; j < deleteRequest.services.length; j++) {
if (deleteRequest.services[j].parentServiceName == parentServiceName) {
break;
}
}
if (j == deleteRequest.services.length) {
deleteRequest.services[j] = {};
deleteRequest.services[j].parentServiceName = parentServiceName;
deleteRequest.services[j].subservices = [];
}
var service = {};
service.serviceId = $scope.siteServices[i].serviceId;
deleteRequest.services[j].subservices.push(service);
}
var deleteUrl = "api/sites/" + $scope.targetEntity.siteId + "/services/" + service.serviceId;
$http.delete(deleteUrl)
.then(function (response) {
});
}
As I understood it you are trying to remove siteServices based by numbers stored in var toDeleteServices = [] so you need to access those numbers by its index. but in service.serviceId = $scope.siteServices[i].serviceId; you are using i instead.
service.serviceId = $scope.siteServices[toDeleteServices[i]].serviceId; as you need actual number of the service to delete.
If I understood your code correctly.

Ionic V1 tabs + SQLite

friends.
I have ionic V1 application with 2 tabs, add and list. And for persist the data, I use SQLite.
My problem.
In add tab, I insert data in database perfectly, but, when I redirect to list, the last that i insert, doesn't display on list
arrList = []
db.transaction(function (tx)
{
var query_users = "SELECT * FROM users";
tx.executeSql(query_users, [], function (tx, results)
{
var len = results.rows.length;
for (var i = 0; i < len; i++) {
arrList.push(results.rows[i]);
}
}, null);
});
$scope.userList = arrList;
What is my mistake?
for (var i = 0; i < len; i++)
{
$scope.arrList.push({id: result.rows.item(i).id, message:
result.rows.item(i).message});
}
i used to push data in this way..
ie is... result.rows.item(i).["variable name"]
may be it will help u...

Having an issue figuring out where to do calculations before using Upsert in mongodb

I'm using the angular-fullstack generator so there's 7 files in one endpoint (index, index.spec, orders.controller, orders.events, orders.integration, orders.model, and orders.socket). I'm not sure where to do computation to store in the fields when there is a PUT/Upsert. All the examples that I can google either use virtual fields or have generic code to do the computation. I know the computation I need to do but have no idea where to put it using this generator.
After a bit more searching this morning, I think what I want is to use getters/setters?
It's working in the controller as I presumed but i'm not sure if it's the best place to put these simple
function doCalcsSingle(res) {
var tOrderitems = 0;
var tRecitems = 0;
var tMissingitems = 0;
var today = new Date();
for(var i = 0; i < res.body.items.length; i++) {
res.body.items[i].missingItems = res.body.items[i].numOfOrdItems - res.body.items[i].numOfRecItems;
if(res.body.items[i].missingItems < 0 || !res.body.items[i].missingItems) {
res.body.items[i].missingItems = 0;
}
res.body.items[i].totalPrice = res.body.items[i].numOfOrdItems * res.body.items[i].unitPrice;
tOrderitems = tOrderitems + res.body.items[i].numOfOrdItems;
tRecitems = tRecitems + res.body.items[i].numOfRecItems;
tMissingitems = tMissingitems + res.body.items[i].missingItems;
if(tMissingitems < 0 || !tMissingitems) {
tMissingitems = 0;
}
}
res.body.totalOrdItems = tOrderitems;
res.body.totalRecItem = tRecitems;
res.body.totalItemsMissing = tMissingitems;
res.body.lastUpdated = today;
if(tMissingitems <= 0) {
res.body.activeOrder = false;
res.body.completedDate = today;
} else {
res.body.activeOrder = true;
}
return res;
}

Resources