Select query with parameters against WebSQL in Sencha Touch 2? - sencha-touch-2

Can I write a simple select query with parameters against WebSQL database using SQL proxy in Sencha Touch 2?
E.g. I would be happy to submit a query to request data for a specific month:
SELECT * FROM Expenses WHERE strftime('%m', SubmitDate) = '04'

OK, after digging into the sources of Sencha Touch SQL proxy, the solution turned out to be using store filters, e.g:
Ext.define('Rich.Lite.Web.store.Expenses', {
extend: 'Ext.data.Store',
requires: 'Rich.Lite.Web.model.Expense',
config: {
model: 'Rich.Lite.Web.model.Expense',
proxy: {
type: "sql"
},
filters: [
{
property: "strftime('%m', date)",
value: "04"
}
]
}
});

Related

Retrieve Project Name

How do you get the project name in Rally?
I'm working with a grid app and all I'm trying to do is include a 'Project' field for the grid view. However, because 'Project' is actually an object, the resulting field is '[object Object]'. So, how is it possible to get the name in string type?
Here's the code from my columnCfgs that deals with making the field.
{
text: 'Project',
dataIndex: this.getContext().getProject().get
},
Try this.getContext().getProject()._refObjectName or this.getContext().getProject().Name
In some cases it is useful to print and explore the object in the console, because it may be that you need to traverse project.data._refObjectName as in this gist, or in your case:
Ext.define('CustomApp', {
extend: 'Rally.app.App',
componentCls: 'app',
items:{ html:'App SDK 2.0 Docs'},
launch: function() {
var currentProject = this.getContext().getProject();
console.log(currentProject);
this.add({
xtype:'container',
html: currentProject.Name
});
}
});

Store contains only data inside "raw" property

I'm having strange problem with my store inside ExtJS. My ASP.NET MVC3 controller returns JSON:
My store:
Ext.define('MyApp.store.Users', {
extend: 'Ext.data.Store',
config: {
// I know the model works
model: 'MyApp.model.User',
storeId: 'Users',
autoLoad: true,
proxy: {
type: 'ajax',
url: 'users/read',
reader: {
type: 'json',
root: 'users'
// also tried this
rootProperty: 'users'
}
}
}
});
Now, when I connect this store to the grid inside ExtJS 4.2.1, the grid shows TWO rows but without data. When I console.log(store) I see the data only inside raw property, not inside data property.
Does anyone know what's the problem? Why isn't there any mapping? The grid's dataIndex is also the same as Models fields (I've done this a thousand times with PHP, I don't know where is the problem here.)
One more thing I've tried. I've tried renderer: function(value) { console.log(value); } inside grid's columns and I was just getting undefined.
Edit: this is how the JSON actually looks like:
Try using root: 'users' not rootProperty. If not specified root defaults to ''.
Sencha Docs
SENCHA what the hell?! Sencha Touch 2 always says put everything in config?
Now when I do that in ExtJS, everything breaks?
I removed everything from config: {} and now it works great.

Event SelectField Sencha Touch 2.1 and Using Store and Model in it. (in Sencha Architect 2)

I begin learn about Sencha Touch 2. So, I have had many problems to ask! ^^ Let's research it.
Now I have a data json like:
{
result: "SUCCESS",
national: [
"Afghanistan",
"Albania",
"Albania",
"Algeria",
"American Samoa",
"Andorra"
]
}
Then, I will load it from url: nation.php file.
How can i load it to My Select Field.??????
Share and Support to me.! Thanks :).
I don't know how to do this in Sencha Architect 2 ( i am not using it).. but still
Instead of asking question without try (I mean you didn't post tried code here), Better you start with Sencha Touch Documentation.
Anyway, you can do it as follows
Model
Ext.define('AppName.model.countries', {
extend : 'Ext.data.Model',
config: {
fields: [
{name: 'name', convert: function(value, record) {
return record.raw;
}}
],
}
});
Store
var myStore = Ext.create("Ext.data.ArrayStore", {
model : 'AppName.model.countries',
proxy: {
type: "ajax",
url : "nation.php",
reader: {
type: 'json',
rootProperty : function(data) {
return data.national;
}
}
},
autoLoad: true
});
Select Field in View
Ext.create('Ext.form.Panel', {
fullscreen: true,
items: [{
xtype: 'selectfield',
store: myStore ,
valueField:'name',
displayField:'name'
}]
});
With Viswa's Support. :) I found this problem - XMLHttpRequest cannot load. Origin is not allowed by Access-Control-Allow-Origin error (browser policy security).
And Sencha Touch document say: " The JsonP proxy is useful when you need to load data from a domain other than the one your application is running on. If your application is running on http://domainA.com it cannot use Ajax to load its data from http://domainB.com because cross-domain ajax requests are prohibited by the browser.
" Also, All we need to do is - "Implement all api in Your Webserver" and Follow JsonP's format code: ( in PHP)
$callback = $_REQUEST['callback'];// check callbackkey
// Create the output object.
$output = array('a' => 'Apple', 'b' => 'Banana');// output data.
//start output
if ($callback) {
header('Content-Type: text/javascript');
echo $callback . '(' . json_encode($output) . ');';
} else {
header('Content-Type: application/x-json');
echo json_encode($output);
}
If. Using Sencha Touch 2.1, You can use:
Ext.data.JsonP.request({
url: 'http://otherdomain/svn_visaapi/trunk/api/visa_api.php/test_json',
callbackKey: 'callback',
success: function(result) {
console.log(result);
//Your success function here...
}
});
- If, Using Sencha Architect, you can use a Store.proxy.JsonP to call api.
- Read more document Sencha Touch 2.1 to see that.

How to dynamically bind images from store to carousel in sencha touch

I have the following Store declared in my sencha touch application
Ext.define('Sample.store.ImageStore', {
extend: 'Ext.data.Store',
config: {
model: 'Sencha.model.ImageModel',
data: [{ name: "cat", url: "http://bleachthemind.files.wordpress.com/2010/08/cute-bunnys-domestic-animals-2785589-1024-768.jpg" },
{ name: "lion", url: "http://images1.fanpop.com/images/photos/2600000/Cheetah-Family-wild-animals-2603080-1280-1024.jpg" }
]
}
});
This is my code being declared in Model:
Ext.define('Sample.model.ImageModel', {
extend: 'Ext.data.Model',
config: {
fields:['name','url']
}
});
I am facing difficulty to construct a view with carousel where data is being binded from the store mentioned above.Please can i know the right syntax to be written in the view with the carousel consuming store data.
You cannot hook up Store into Carousel in Sencha Touch. It seems that you have to manually do it through some way like this:
yourCarousel = Ext.getCmp('your_carousel_id');
store.each(function(record){
yourCarousel.add({
html: '<img src=' + record.get('url') + '/>'
});
});
Thiem's answer is fine.
If you want a more complete example, have a look at this nice post:
http://edspencer.net/2012/02/building-a-data-driven-image-carousel-with-sencha-touch-2.html
I think it should cover all your needs ;)
Hope this helps.

ExtJS4 / Sencha Touch 2: Reuse data (loaded into store) in different views with different sorting

I have data in an external database which can be accessed via JSON. Now I want to provide different views on these data sets (eg. different sorting, ..). Is it possible to use one single store for this or do I need two stores accessing the same URL except with a different sorter?
My example code looks like this:
Ext.define('MyApp.store.MyStore', {
extend: 'Ext.data.Store',
requires: [
'MyApp.model.MyModel'
],
config: {
autoLoad: true,
model: 'MyApp.model.MyModel',
storeId: 'MyJsonStore',
proxy: {
type: 'ajax',
url: 'http://localhost/index.php?data=MyData&format=json',
reader: {
type: 'json'
}
},
sorters: [
{
direction: 'DESC',
property: 'MyRating'
},
{
direction: 'ASC',
property: 'MyLabel'
}
] } });
And one view should now render a list sorted by the rating and a second one should display a list sorted by the label.
Is there a way to prevent querying the DB twice?
Thanks - I just started out with Sencha Touch and ExtJS --- therefore please excuse my simple question ;)
Somehow I couldn't find any smart solution by asking Google for this basic task..
You don't have to worry about anything unless your two views are presented at the same time. Just re-sort the same store locally.
If they are presented at the same time you will have to create a copy of a store. Otherwise they will show exact same information.