SDK 2.0 PreferenceManager, how do I create and update a preference using PreferenceManager? Just using update method does not seem to store the value, and create is "not a function" error. TypeError: Rally.data.PreferenceManager.create is not a function.
//load app preferences
Rally.data.PreferenceManager.load({
appID: this.myAppId,
filterByUser: true,
success: function(prefs) {
//process prefs
if(prefs.releases) {
this.releaseNames = prefs.releases;
} else {
//first time, nothing to load so create the app preferences
Rally.data.PreferenceManager.create({
appID: this.myAppId,
filterByUser: true,
settings: {
releases: ""
},
success: function(updatedRecords, notUpdatedRecords) {
//yay!
debugger;
}
});
}
}
});
//things have changed, save new app preferences
Rally.data.PreferenceManager.update({
appID: this.myAppId,
filterByUser: true,
settings: {
releases: this.releaseNames
},
success: function(updatedRecords, notUpdatedRecords) {
//yay!
debugger;
}
});
I found that the create method is not required, the update method is all that is needed.
Related
I'm trying to use the Rally Lookback API with Deft Promises. The code below works with wsapi store, but not the snapshot store. Shouldn't the snapshot store work the same? The error received is: TypeError: Cannot read properties of undefined (reading 'getProxy') How to make this work with the snapshot store?
launch: function() {
Deft.Promise.all([
this.loadRecords('UserStory'),
this.loadRecords('Defect'),
this.loadRecords('TestCase')
]).then({
success: function(recordSets) {
// recordSets = [
// UserStoryRecords,
// DefectRecords,
// TestCaseRecords
// ];
console.log(recordSets);
},
failure: function() {
//Handle error loading the store here...
console.log("Failed.");
}
});
}, // end launch
loadRecords: function(model) {
var deferred = Ext.create('Deft.Deferred');
// Ext.create('Rally.data.wsapi.Store', { // This works!
Ext.create('Rally.data.lookback.SnapshotStore', { // TypeError!!
limit: 'infinity',
model: model,
fetch: ['Name', 'ObjectID'],
autoload: true
}).load({
callback: function(records, operation, success) {
if (operation.wasSuccessful()) {
deferred.resolve(records);
} else {
deferred.reject('Rejected');
}
}
});
return deferred.promise;
},
So it looks like I found the answer, you don't use model in SnapshotStore requests, pass the name of the data store you want to a _TypeHierarchy filter as such. Below appears to work as expected.
launch: function() {
Deft.Promise.all([
this.loadRecords('HierarchicalRequirement'),
this.loadRecords('Defect'),
this.loadRecords('TestCase')
// do some more stuff
]).then({
success: function(recordSets) {
// recordSets = [
// UserStoryRecords,
// DefectRecords,
// TestCaseRecords
// ];
console.log(recordSets);
},
failure: function() {
//Handle error loading the store here...
console.log("Failed.");
}
});
}, // end launch
loadRecords: function(model) {
var deferred = Ext.create('Deft.Deferred');
Ext.create('Rally.data.lookback.SnapshotStore', {
limit: 'infinity',
// model: model, // Doesn't work => TypeError
fetch: ['Name', 'ObjectID'],
autoload: true,
filters: [{
property: '_TypeHierarchy',
operator: 'in',
value: [model] // WORKS!!
}]
}).load({
callback: function(records, operation, success) {
if (operation.wasSuccessful()) {
deferred.resolve(records);
} else {
deferred.reject('Rejected');
}
}
});
return deferred.promise;
}
I have problem with uploading files from my ember.js frontend to grails backend. I can't use any of ember plugins like ember-uploader because of supporting IE8. Any advices how to solve this problem ?
BlueImp's jQuery File Upload claims it supports IE 6+. Read more about it:
https://github.com/blueimp/jQuery-File-Upload
I use it via an Ember component like this:
{{file-upload uploadUrl=uploadUrl filename="files"
buttonText="Upload files"
hiddenName="fileId" hiddenValue=fileId
uploaded="filesUploaded"}}
and initialize the plugin in the component's didInsertElement:
didInsertElement: function() {
var self = this;
this.$('#'+this.get('inputId')).fileupload({
dataType: 'json',
url: this.get('uploadUrl'),
formData: function() {
return [{name: self.get('hiddenName'), value: self.get('hiddenValue')}];
},
done: function(e, data) {
self.sendAction('uploaded', data.result);
self.markCompleted(data.result.filenames);
},
fail: function (e, data) {
self.sendAction('failed', data.result);
},
add: function(e, data) {
data.process().done(function () {
data.submit();
});
},
});
Thanks for response kielni, but I used different approach than yours.
I used solution from this blog post: Cross-browser AJAX uploads with Ember.js and mOxie
And code in component that worked for me:
var fileInput = new mOxie.FileInput({
browse_button: this.$('.file-pick-button').get(0),
multiple: false
});
fileInput.onchange = function (e) {
var file = fileInput.files[0];
var reader = new mOxie.FileReader();
reader.onloadend = function () {
ajax({
type: "POST",
timeout: 5000,
url: config.serverURL + '/files/',
data: {
transportID: id,
filename: file.name,
file: reader.result
}
});
};
reader.readAsBinaryString(file);
};
fileInput.init();
I am developing a Sencha Touch 2 app with user authentication.
I use a token for authentication.
The logic.
Check is a token exists in local storage:
var tokenStore = Ext.getStore('TokenStore'),
token = tokenStore.getAt(0).get('token');
If there is a token, check if it's valid.
I am doing a read from a model which is connected to my API which, returns success or fail - depending on the token - if it's valid or not.
TestApp.model.CheckAuthModel.load(1, {
scope: this,
success: function(record) {
// Here, I know the token is valid
},
failure: function() {
console.log('failure');
},
callback: function(record) {
console.log('callback');
console.log();
}
});
And here is the router, which handles the logic for the views:
Ext.define("TestApp.controller.Router", {
extend: "Ext.app.Controller",
config: {
refs: {
HomeView: 'HomeView',
LoginView: 'LoginView',
ProductsView: 'ProductsView',
ProductsViewTwo: 'ProductsViewTwo'
},
routes: {
'': 'home',
'home' : 'home',
'login' : 'login',
'products' : 'products',
'testingtwo' : 'testingtwo'
}
},
home: function () {
console.log('TestApp.controller.Router home function');
var initialItem = Ext.Viewport.getActiveItem(),
comp = this.getHomeView();
if (comp === undefined) comp = Ext.create('TestApp.view.HomeView');
Ext.Viewport.animateActiveItem(comp, {
type: 'slide',
listeners: {
animationend: function() {
initialItem.destroy();
}
}
});
},
login: function () {
var initialItem = Ext.Viewport.getActiveItem(),
comp = this.getLoginView();
if (comp === undefined) comp = Ext.create('TestApp.view.LoginView');
Ext.Viewport.animateActiveItem(comp, {
type: 'slide',
listeners: {
animationend: function() {
initialItem.destroy();
}
}
});
},
products: function () {
var initialItem = Ext.Viewport.getActiveItem(),
comp = this.getProductsView();
if (comp === undefined) comp = Ext.create('TestApp.view.ProductsView');
Ext.Viewport.animateActiveItem(comp, {
type: 'slide',
listeners: {
animationend: function(){
initialItem.destroy();
}
}
});
},
testingtwo: function () {
var initialItem = Ext.Viewport.getActiveItem(),
comp = this.getProductsViewTwo();
if (comp === undefined) comp = Ext.create('TestApp.view.ProductsViewTwo');
Ext.Viewport.animateActiveItem(comp, {
type: 'slide',
listeners: {
animationend: function(){
initialItem.destroy();
}
}
});
},
launch: function() {
console.log('TestApp.controller.Router launch!');
}
});
Now, how can I link the router with the check auth model callback?
I want to know the auth state when the app reaches the router.
In other MVC frameworks, I could do a before filter, on the router, check for auth and handle the routes accordingly.
Can i do this in Sencha Touch 2?
Any ideas?
Hi I think this section in the documentation is exactly what you need:
before : Object
Provides a mapping of Controller functions to filter functions that are run before them when dispatched to from a route. These are usually used to run pre-processing functions like authentication before a certain function is executed. They are only called when dispatching from a route. Example usage:
Ext.define('MyApp.controller.Products', {
config: {
before: {
editProduct: 'authenticate'
},
routes: {
'product/edit/:id': 'editProduct'
}
},
//this is not directly because our before filter is called first
editProduct: function() {
//... performs the product editing logic
},
//this is run before editProduct
authenticate: function(action) {
MyApp.authenticate({
success: function() {
action.resume();
},
failure: function() {
Ext.Msg.alert('Not Logged In', "You can't do that, you're not logged in");
}
});
}
});
http://docs.sencha.com/touch/2.3.1/#!/api/Ext.app.Controller-cfg-before
Of course, it's still up to you to decide whether you should check every time or should cache the auth result for sometime.
Updated to answer comment below
Honestly, i am not sure how they was going to declare that static method Authenticate in Sencha (you would be able to do it normally through Javascript i think, i.e.: prototype).
But there are other better options to solve just that Authenticate function:
Just create a singleton class that handle utility stuffs.
http://docs.sencha.com/touch/2.3.1/#!/api/Ext.Class-cfg-singleton
If you really want to use MyApp, you can declare within the Ext.app.Application (in app.js). Then call it from the global instance MyApp.app.some_function(). I wouldn't exactly recommend this method because you change app.js, that might bring problem if you upgrade sencha touch.
You could implemented auth check in application's launch function or in your auth controller's init function and based on the response redirect the to appropriate url. Something like this:
TestApp.model.CheckAuthModel.load(1, {
scope: this,
success: function(record) {
this.redirectTo("home/");
},
failure: function() {
this.redirectTo("login/");
console.log('failure');
},
callback: function(record) {
console.log('callback');
console.log();
}
});
We have made a Win8 app using phonegap.
The application also has a reference to a Windows runtime component used to perform some asyc task.
The application has a camera feature, where in the camera is invoked, picture taken and then the picture is displayed on the screen in the success call back function. Everything works perfectly when running directly from visual studio express. The problem arises when we create a package of the application and deploy it using either metro sideloader or powershell. The camera success callback function is never called.
The code for calling the camera is something like this:
CameraService = function() {
var that = {};
that.invokecamera = function(callback) {
try {
GLOBALS.callback = callback;
if (GLOBALS.Ready) {
navigator.camera.getPicture(that.onSuccess, GLOBALS.ThrowException, {
quality : 50,
saveToPhotoAlbum : true,
destinationType : Camera.DestinationType.FILE_URI
});
}
} catch (err) {
alert(err);
} finally {
}
}
that.onSuccess=function(imageURI) {
GLOBALS.ImagePath = imageURI;
GLOBALS.callback(imageURI);
}
return that;
}
Ok, So i figured out the issue mentioned here:
issue with installed app
To fix this i, as mentioned in the link replaced
Windows.Storage.StorageFolder.getFolderFromPathAsync(packageId.path).done(function (storageFolder) {
With
var storageFolder = Windows.Storage.ApplicationData.current.localFolder;
In the cordova.js file. I am using cordova 2.4.0.
A more elaborated exmple
Windows.Storage.StorageFolder.getFolderFromPathAsync(packageId.path).done(function (storageFolder) {
storageFolder.createFileAsync(tempPhotoFileName, Windows.Storage.CreationCollisionOption.generateUniqueName).done(function (file) {
file.openAsync(Windows.Storage.FileAccessMode.readWrite).done(function (fileStream) {
Windows.Storage.Streams.RandomAccessStream.copyAndCloseAsync(_stream, fileStream).done(function () {
var _imageUrl = URL.createObjectURL(file);
successCallback(_imageUrl);
}, function () { errorCallback("Resize picture error."); });
}, function () { errorCallback("Resize picture error."); });
}, function () { errorCallback("Resize picture error."); });
});
Becomes
var storageFolder = Windows.Storage.ApplicationData.current.localFolder;
storageFolder.createFileAsync(tempPhotoFileName, Windows.Storage.CreationCollisionOption.generateUniqueName).done(function (file) {
file.openAsync(Windows.Storage.FileAccessMode.readWrite).done(function (fileStream) {
Windows.Storage.Streams.RandomAccessStream.copyAndCloseAsync(_stream, fileStream).done(function () {
var _imageUrl = URL.createObjectURL(file);
successCallback(_imageUrl);
}, function () { errorCallback("Resize picture error."); });
}, function () { errorCallback("Resize picture error."); });
}, function () { errorCallback("Resize picture error."); });
I'm trying to upload a file using Ext JS forms and in case of success or failure, show appropriate messages. But I'm not able to get the desired result. I'm not able to make success or failure callbacks work in form.submit action.
What I've done till now is:
Creating a form with this script:
new Ext.FormPanel({
fileUpload: true,
frame: true,
url: '/profiler/certificate/update',
success: function() {
console.log(arguments);
},
failure: function() {
console.log(arguments);
}
}).getForm().submit()
/*
The response Content-Type is text/html (with charcode=utf8);
The response JSON is: { "success": true }
*/
Setting the response Content-Type to text/html based on this answer.
Sending an appropriate JSON result back, based on Ext JS docs. The response captured via Fiddler is:
{"success":false}
or
{"success":true}
I even set the response Content-Type to application/json. But still no success.
I've read links like this and this, but none of them helped. Please note that I also tried another script which creates a form, with an upload field in it, and a save button, and I submitted the form in the handler of the save button. But still no callback is fired.
Here's a working example - Javascript code:
Ext.onReady(function () {
Ext.define('ImagePanel', {
extend: 'Ext.form.Panel',
fileUpload: true,
title: 'Upload Panel',
width: 300,
height: 100,
onUpload: function () {
this.getForm().submit({
url: 'upload.php',
scope: this,
success: function (formPanel, action) {
var data = Ext.decode(action.response.responseText);
alert("Success: " + data.msg);
},
failure: function (formPanel, action) {
var data = Ext.decode(action.response.responseText);
alert("Failure: " + data.msg);
}
});
},
initComponent: function () {
var config = {
items: [
{
xtype: 'fileuploadfield',
buttonText: 'Upload',
name: 'uploadedFile',
listeners: {
'change': {
scope: this,
fn: function (field, e) {
this.onUpload();
}
}
}
}
]
};
Ext.apply(this, Ext.apply(this.initialConfig, config));
this.callParent(arguments);
}
});
var panel = Ext.create('ImagePanel', {
renderTo: Ext.getBody()
});
});
And PHP code:
<?php
if (isset($_FILES)) {
$temp_file_name = $_FILES['uploadedFile']['tmp_name'];
$original_file_name = $_FILES['uploadedFile']['name'];
echo '{"success": true, "msg": "'.$original_file_name.'"}';
} else {
echo '{"success": false, "msg": "No Files"}';
}
I have been struggling with this for quite some time now as well. Here's my code:
Ext.getCmp('media-upload-form').getForm().doAction('submit', {
url: './services/recordmedia/upload',
method: 'post',
waitMsg: 'Please wait...',
params: {
entityId: this.entityId,
},
failure: function(form, action){
alert(_('Error uploading file'));
this.fireEvent('file-upload');
this.close();
},
success: function(form, action){
this.fireEvent('file-upload');
this.close();
},
scope: this
})
The response was always wrapped in <pre> tags by the browser, what caused the Extj lib not to call the callbacks. To fix this:
make sure your server returns the correct json: {"success":true}
make sure that the content-type is set to text/html
Actually, this is well covered by docs for Ext.form.Panel and Ext.form.Basic. The problem with your code not working is that there are no config options "success", "failure" for the form panel. You should put them in the config object passed to the submit action. So your code should look like:
new Ext.FormPanel({
fileUpload: true,
frame: true
}).getForm().submit({
url: '/profiler/certificate/update',
success: function() {
console.log(arguments);
},
failure: function() {
console.log(arguments);
}
});
Note the difference: In Ext 4, there is a form component (Ext.form.Panel) which is basically a view component concerned with how you form looks, and then there is the underlying form class (e.g. Ext.form.Basic) concerned with the functionality. Form submissions are handled by Ext.form.Basic (or whatever returned by your form.getForm()).