sencha touch~Reset extra param when load more event fire - sencha-touch-2

I need to reassign extra param when load more even fire. But I dont have any idea
Here is my code
List.js
Ext.define('bluebutton.view.BlueButton.TestingList', {
extend: 'Ext.List',
xtype: 'testinglistcard',
requires: [
'Ext.field.Select',
'Ext.field.Search',
// 'bluebutton.view.BlueButton.MemberDetail',
'Ext.plugin.ListPaging',
'Ext.plugin.PullRefresh',
'Ext.dataview.Override'
],
config: {
styleHtmlContent: true,
scrollable: 'vertical',
indexBar: true,
singleSelect: true,
onItemDisclosure: true,
grouped: true,
variableHeights : false,
store : { xclass : 'bluebutton.store.BlueButton.Testing'},
itemHeight :100,
loadingText : 'loading',
id :'testinglist',
plugins: [
{ xclass: 'Ext.plugin.PullRefresh',
refreshFn: function() {
var transaction = Ext.ModelMgr.getModel('bluebutton.model.BlueButton.Testing');
var proxy = transaction.getProxy();
proxy.setExtraParam('refresh', 'true' );
Ext.getStore('testingstore').load();
},
},
{
xclass: 'Ext.plugin.ListPaging',
autoPaging: true,
loadNextPage: function() {
var transaction = Ext.ModelMgr.getModel('bluebutton.model.BlueButton.Testing');
var proxy = transaction.getProxy();
proxy.setExtraParam('refresh', );
Ext.getStore('testingstore').load();
}
},
],
masked: {
xtype: 'loadmask',
message: 'loading...'
}, // masked
emptyText: '<p class="no-search-results">No member record found matching that search</p>',
itemTpl: Ext.create(
'Ext.XTemplate',
'<div class="tweet-wrapper">',
'<table>',
'<tr>',
'<td>',
' <div class="tweet">',
' <h3>{invoiceId}</h3>',
' <h3>Name: {billNumber}</h3>',
' <h3>Point Avalaible : {invoiceDate} , Last Visited : {invoiceAmount}</h3>',
' </div>',
'</td>',
'</tr>',
'</table>',
'</div>'
),
},
});
Store.js
Ext.define('bluebutton.store.BlueButton.Testing', {
extend: "Ext.data.Store",
requires: ['bluebutton.model.BlueButton.Testing'],
config: {
grouper: {
groupFn: function (record) {
return record.get('invoiceId')[0];
}
},
model :'bluebutton.model.BlueButton.Testing',
storeId :'testingstore',
autoLoad: true,
pageSize: 5,
clearOnPageLoad: false,
}
});
Model.js
Ext.define('bluebutton.model.BlueButton.Testing', {
extend: 'Ext.data.Model',
config: {
idProperty: 'testingModel',
fields: [
{ name :'invoiceId'},
{ name: 'billNumber' },
{ name: 'invoiceDate' },
{ name: 'invoiceAmount' },
{ name :'downloadLink'},
{ name: 'refresh' },
],
proxy: {
type: 'rest',
url: 'http://192.168.251.108:8080/RESTFulExample/rest/json/metallica/invoicejsonPost',
reader: 'json',
actionMethods: {
create: 'POST',
read: 'GET',
update: 'PUT',
destroy: 'DELETE'
},
noCache: false, // get rid of the '_dc' url parameter
// extraParams: {
// userid: "test",
// // add as many as you need
// },
reader: {
type: 'json',
rootProperty: 'invoice'
},
writer: {
type: 'json',
},
}
}
});
I need to assign extra param "refresh" to true when i refresh the list. On the other hand, if the load more event fire i need to assign param refresh to false. Please give me solution. Thanks

I dont think you can do it the way you ask. But you can listen to the load event and change your refresh parameter there.
{
xtype: 'store',
//Your Code
listeners: {
load: function(store){
store.getProxy.setExtraParam('refresh', false);
}
}
}
Hope it helps

Related

how to get the form values and insert that values in the db using sencha touch

I want to store the login form details in the database .for that,i wrote the following code .
In my view code
Ext.define('SampleForm.view.LoginForm', {
extend: 'Ext.form.Panel',
//id:'loginform',
requires:[
'Ext.field.Email',
'Ext.field.Password'
],
config: {
fullscreen: true,
layout:{
type:'vbox'
},
items: [
{
xtype: 'fieldset',
title: 'Login',
id: 'loginform',
items: [
{
xtype:'textfield',
label:'Name',
name:'name'
},
{
xtype: 'emailfield',
name: 'email',
label: 'Email'
},
{
xtype: 'passwordfield',
name: 'password',
label: 'Password'
}
]
},
{
xtype: 'button',
width: '30%',
text: 'Login',
ui: 'confirm',
action:'btnSubmitLogin'
}
]
}
});
In controller
Ext.define("SampleForm.controller.LoginForm", {
extend: "Ext.app.Controller",
config: {
view: 'SampleForm.view.LoginForm',
refs: [
{
loginForm: '#loginform',
Selector: '#loginform'
}
],
control: {
'button[action=btnSubmitLogin]': {
tap: "onSubmitLogin"
}
}
},
onSubmitLogin: function () {
alert('Form Submitted successfully');
console.log("test");
var values = this.getloginform();
/* Ext.Ajax.request({
url: 'http://www.servername.com/login.php',
params: values,
success: function(response){
var text = response.responseText;
Ext.Msg.alert('Success', text);
}
failure : function(response) {
Ext.Msg.alert('Error','Error while submitting the form');
console.log(response.responseText);
}
});*/
form.submit({
url:"http://localhost/sencha2011/form/login.php"
});
},
launch: function () {
this.callParent();
console.log("LoginForm launch");
},
init: function () {
this.callParent();
console.log("LoginForm init");
}
});
when i click the submit button,alert message coming,but values aren't stored in the database.and in console im getting this error,Uncaught TypeError: Object [object Object] has no method 'getloginform'.
Can anyone help me to how to insert the values in the db.
Javascript is case-sensitive. From Sencha Touch docs:
These getter functions are generated based on the refs you define and
always follow the same format - 'get' followed by the capitalized ref
name.
To use the getter method for ref, loginForm, and to get the form values use:
var values = this.getLoginForm().getValues();

Form + nested list not showing after submit

I'm just learning sencha touch 2, MVC. I would to make a simple form that get a value, pass to a PHP file (for an API call to a web-service), move to a Nested List and show results.
But, my app doesn't show nothing after submit... Value is captured correctly (I see it in console log).
Please someone could me help?
Consider for testing that for now I don't pass value, and my API call calls directly with a hard-coded value. In future I'll work to pass form value...
Thank you in advance!
This is "app.js"
Ext.application({
name: 'Appre',
icon: 'resources/icons/icon.png',
phoneStartupScreen: 'resources/images/phone_startup.png',
//tabletStartupScreen: 'tablet_startup.png',
glossOnIcon: false,
//profiles: ['Phone', 'Tablet'],
views : ['Viewport','SearchCap','ElencoRistoranti'],
models: ['ElencoRistoranti'],
stores: ['RistorantiCap'],
controllers: ['SearchCap'],
viewport: {
layout: {
type: 'card',
animation: {
type: 'slide',
direction: 'left',
duration: 300
}
}
},
launch: function() {
Ext.create('Appre.view.Viewport')
} // launch: function() {
}) // Ext.application
This is form "search cap"
Ext.define('Appre.view.SearchCap', {
extend: 'Ext.form.Panel',
xtype: 'appre-searchCap',
config: {
items: [{
xtype: 'fieldset',
layout: 'vbox',
items: [{
xtype: 'textfield',
name: 'cap',
placeHolder: 'Cap'
},
{
xtype: 'button',
text: 'Cerca',
action :'searchCap',
id:'btnSubmitLogin'
}] // items
}] // items
}, // config
initialize: function() {
this.callParent(arguments);
console.log('loginform:initialize');
}
});
This is controller
Ext.define('Appre.controller.SearchCap', {
extend : "Ext.app.Controller",
config : {
refs : {
btnSubmitLogin: 'button[action=searchCap]',
form : 'appre-searchCap'
},
control : {
btnSubmitLogin : {
tap : "onSubmitLogin"
}
}
},
onSubmitLogin : function() {
console.log("onSubmitLogin");
var values = this.getForm().getValues();
console.log(values);
var $this=this;
Ext.Ajax.request({
url: 'cerca-ristoranti-cap.php',
method: 'POST',
params: {
values: Ext.encode({form_fields: values})
},
success: function(response, opts) {
var obj = Ext.decode(response.responseText);
//Ext.Msg.alert('Contact Complete!', obj.responseText);
$this.resetForm();
Ext.Viewport.add(Ext.create('Appre.view.ElencoRistoranti'));
Ext.Viewport.setActiveItem(Ext.create('Appre.view.ElencoRistoranti'));
},
failure: function(response, opts) {
console.log('server-side failure with status code ' + response.status);
}
});
},
resetForm: function() {
this.getForm().reset();
},
launch : function() {
this.callParent();
console.log("LoginForm launch");
},
init : function() {
this.callParent();
console.log("LoginForm init");
}
});
And this is Nested List
Ext.define('Appre.view.ElencoRistoranti', {
extend: 'Ext.Panel',
xtype: 'appre-elencoristoranti',
config: {
xtype: 'nestedlist',
title: 'Cap',
displayField: 'name',
store: {
type: 'tree',
fields: [
'id_restaurant', 'name',
{name: 'leaf', defaultValue: true}
],
root: {
leaf: false
},
proxy: {
type: 'ajax',
url: 'cerca-ristoranti-cap.php',
reader: {
type: 'json',
rootProperty: 'restaurants'
} //reader
} // proxy
},
detailCard: {
xtype: 'panel',
scrollable: true,
styleHtmlContent: true
},
listeners: {
itemtap: function(nestedList, list, index, element, post) {
this.getDetailCard().setHtml(post.get('name'));
}
}
} // config
});
cerca-ristoranti-cap.php it's a simple function that returns an array like this:
{
"restaurants":[{
"id_restaurant":"40",
"name":"La Saliera",
"zip":"00128",
"lat":"41.7900229",
"lgt":"12.4513128"
}, {
"id_restaurant":"64",
"name":"Osteria del Borgo",
"zip":"00128",
"lat":"41.7887363",
"lgt":"12.5149867"
}]
}
Hi #sineverba sorry for response a little late, but here something this how you want show,
Viewport.js
Ext.define('myapp.view.Viewport' , {
extend : 'Ext.viewport.Default',
xtype : "viewport",
config: {
fullscreen: true,
styleHtmlContent: true,
style: 'background:#ffffff;',
layout : 'card',
autoDestroy : false,
cardSwitchAnimation : 'slide',
items: [
{
xtype: 'appre-searchCap'
},
],
}
})
app.js
Ext.Loader.setConfig({
enabled: true
})
Ext.application({
name: 'myapp',
requires: [
'myapp.view.SearchCap',
'myapp.view.ElencoRistoranti',
'myapp.view.SearchElenco',
],
controllers: ['SearchCap'],
models: ['myapp.model.SearchCapModel'],
launch: function() {
Ext.create('myapp.view.Viewport')
}
});
SearchCapModel.js
Ext.define('myapp.model.SearchCapModel', {
extend: 'Ext.data.Model',
config: {
idProperty: 'id_restaurant',
fields: [
{ name: 'id_restaurant', type: 'string' },
{ name: 'name', type: 'string'},
{ name: 'zip', type: 'string' },
{ name: 'lat', type: 'string'},
{ name: 'lgt', type: 'string'}
],
}
})
SearchCapStore.js
Ext.define('myapp.store.SearchCapStore', {
extend: 'Ext.data.Store',
config: {
model: 'myapp.model.SearchCapModel',
autoLoad: true,
proxy: {
type: 'ajax',
url : 'cerca-ristoranti-cap.json',
reader: {
type: 'json',
rootProperty: 'restaurants'
} //reader
},
}
});
SearchCap.js
Ext.define('myapp.controller.SearchCap', {
extend : "Ext.app.Controller",
views: ['SearchElenco'],
config : {
refs : {
elencoListContainer: 'elencolistcontainer',
btnSubmitLogin: 'button[action=searchCap]',
form : 'appre-searchCap',
},
control : {
btnSubmitLogin : {
tap : "onSubmitLogin"
}
}
},
onSubmitLogin : function() {
console.log("onSubmitLogin");
var values = this.getForm().getValues();
console.log(values);
Ext.Ajax.request({
url: 'cerca-ristoranti-cap.json',
method: 'POST',
params: {
values: Ext.encode({form_fields: values})
},
success: function(response, opts) {
var obj = response.responseText;
Ext.Msg.alert('Contact Complete!', obj);
Ext.Viewport.add(Ext.create('myapp.view.SearchElenco'));
Ext.Viewport.setActiveItem(1);
},
failure: function(response, opts) {
console.log('server-side failure with status code ' + response.status);
}
});
},
resetForm: function() {
this.getForm().reset();
},
launch : function() {
this.callParent();
console.log("LoginForm launch");
},
init : function() {
this.callParent();
console.log("LoginForm init");
}
});
SearchElenco.js
Ext.define('myapp.view.SearchElenco', {
extend: 'Ext.Container',
xtype: 'elencolistcontainer',
requires: ['myapp.store.SearchCapStore'],
initialize: function() {
this.callParent(arguments);
var s = Ext.create('myapp.store.SearchCapStore')
var notesList = {
xtype: 'appre-elencoristoranti',
store: Ext.getStore(s).setAutoLoad(true),
listeners: {
disclose: {
fn: this.onNotesListDisclose,
scope: this
}
}
};
this.add([notesList])
},
onNotesListDisclose: function(list, record, target, index, event, options) {
console.log('editNoteCommand');
this.fireEvent('editNoteCommand', this, record);
},
config: {
layout: {
type: 'fit'
}
}
});
ElencoRistoranti.js
Ext.define('myapp.view.ElencoRistoranti', {
extend: 'Ext.dataview.List',
xtype: 'appre-elencoristoranti',
id: 'appreElenco',
config: {
emptyText: '<pre><div class="notes-list-empty-text">No list found.</div></pre>',
onItemDisclosure: false,
itemTpl: '<pre><div class="list-item-title">{id_restaurant}</div><div class="list-item-narrative">{name}</div></pre>',
}
});
SearchCap.js - View
Ext.define('myapp.view.SearchCap', {
extend: 'Ext.form.Panel',
xtype: 'appre-searchCap',
id: 'appreSearchCap',
config: {
layout: {
type: 'vbox',
},
items: [
{
xtype: 'fieldset',
title: 'Cap',
instructions: 'Enter Cap',
items: [
{
xtype: 'textfield',
name: 'cap',
placeHolder: 'Cap'
},
{
xtype: 'button',
text: 'Cerca',
ui: 'confirm',
action :'searchCap',
id:'btnSubmitLogin'
}
] // items
}
] // items
}, // config
initialize: function() {
this.callParent(arguments);
console.log('loginform:initialize');
}
});
I hope help you and if you have a dude please let me know. :)

Sencha Touch Tree Store 'Object has no method getRootNode'

I am developing an Android 2.3.3 app using PhoneGap and Sencha Touch 2 ...
I have an Login view from which i redirect to nested list view in my app ... I used an inline store for the nested list and i defined the type as 'tree' for the store ...
The first time i am trying to load the app and when i click on Login it is giving me an error ... The error is stated below :
Uncaught TypeError: Object [object Object] has no method 'getRootNode' at file:///android_asset/www/sencha/sencha-touch-all.js:15
But after getting the error if i force close the app and open it again everything is working fine ...
My code is :
Login.js
Ext.define("DDLApp.view.Login", {
//extent panel class
extend: "Ext.form.Panel",
//DOM in fieldset
requires: "Ext.form.FieldSet",
xtype: 'formLogin',
id:'loginForm',
config: {
scrollable: 'vertical',
id: 'login',
items: [
{
xtype: "toolbar",
docked: "top",
},
{
xtype: "toolbar", //Toolbar with heading as login
docked: "top",
title: "Login",
ui:'light',
id:"idHeaderTwo",
cls:"clsLoginHeader"
},
{
xtype: 'textfield', //textfield for username
name: 'Username',
required: true,
id:"idUserName",
cls:"clsUserName",
useClearIcon: false
},
{
xtype: 'passwordfield', //textfield for password
name: 'password',
required: true,
id:"idPassword",
cls:"clsPassword",
useClearIcon: false
},
{
xtype: 'button', //Login button
text: 'Login',
ui: 'confirm',
cls:'btnLogin',
width:'30%',
handler: function(SuccessFlag) { //Login button handler
ui: 'confirm',
console.log('Login Button pressed');
var form = Ext.getCmp('login');
//get username and password from form elements
var user = form.getValues().Username;
var pwd = form.getValues().password;
var msg = new Ext.MessageBox();
onLoad();
if(user == "" || pwd == "")
{
var errMsg = '';
if(user == "")
{
errMsg+= 'Username is required<br/>';
}
if(pwd == "")
{
errMsg+= 'Password is required';
}
msg.show({
title: 'LOGIN ERROR',
message: errMsg,
ui:'light',
cls: 'vm_error',
showAnimation: 'fadeIn',
hideAnimation: 'fadeOut',
buttons: [{text:'OK',itemId:'ok'}],
fn:function(){
Ext.emptyFn();
}
});
}
else
{
form.setMasked({
xtype:'loadmask',
message:'Loading...'
});
//Check for network connectivity
if(onDeviceReady())
{
//Fire a json service
Ext.util.JSONP.request({
url: DDLApp.app.oneTimeServiceUrl,
dataType: "jsonp",
params: {
type:'fetch',
username:user,
password:pwd
},
success: function (result) {
//if username and password matches
if(result.Success == true)
{
//setLocalStorage(result);
localStorage.setItem('userName',user);
localStorage.setItem('userPassword',pwd);
localStorage.setItem('totalData',JSON.stringify(result.Data));
localStorage.setItem('userData',JSON.stringify(result.Data.user));
localStorage.setItem('userIncidentData',JSON.stringify(result.Data.incidentList));
localStorage.setItem('impactData',JSON.stringify(result.Data.impact));
localStorage.setItem('incidentTypeData',JSON.stringify(result.Data.incident_type));
localStorage.setItem('categoryData',JSON.stringify(result.Data.category));
localStorage.setItem('statusData',JSON.stringify(result.Data.statusDropdown));
var indexPanel = Ext.create('DDLApp.view.Main');
Ext.Viewport.add(indexPanel);
Ext.Viewport.setActiveItem(indexPanel,{type: 'slide', direction: 'right'});
form.unmask();
}
else{
msg.show({
title: 'LOGIN ERROR',
message: 'Invalid Username/Password',
ui:'light',
cls: 'vm_error',
showAnimation: 'fadeIn',
hideAnimation: 'fadeOut',
buttons: [{text:'OK',itemId:'ok'}],
fn:function(){
Ext.emptyFn();
}
});
form.unmask();
}
}
});
}
////If network is not present
else
{
form.unmask();
msg.show({
title: 'NETWORK CONNECTION ERROR',
message: "We're Sorry but it appears your device is not connected to the internet . Please check your internet settings and try again.",
ui:'light',
cls: 'vm_error',
showAnimation: 'fadeIn',
hideAnimation: 'fadeOut',
buttons: [{text:'Retry',itemId:'retry'}],
fn:function(){
window.location.reload();
}
});
}
}
},
},
{
xtype: 'button', //clear button
text: 'Clear',
width:'30%',
ui: 'confirm',
cls:'btnClear',
style: 'background:#4A4245;',
handler: function() {
this.up('formpanel').reset(); //reset all form elements
},
}
]
},
});
IncidentsList.js
Ext.define("DDLApp.view.IncidentsList", {
extend: "Ext.Container",
xtype: 'incidentsList',
id: 'idIncList',
requires:[
'Ext.dataview.NestedList',
'Ext.data.proxy.Memory',
'Ext.data.TreeStore',
],
alias:'widget.incidentslist',
config: {
id: 'idIncidentList',
layout:'fit',
items: [
{
xtype: "toolbar",
docked: "top",
cls:'clsDDLHeader',
items: [
{xtype:'spacer'},
{ xtype: 'title' ,
cls: 'clsRightTitle',
id: 'idIncidentsListTitle',
title:"Welcome",
},
]
},
{
xtype: "toolbar",
ui:'light',
id:"idHeaderTwo",
cls:"clsHeaderTwo" ,
items: [
{ xtype: 'title' ,
cls: 'clsLeftTitle',
title: "My Incidents",
},
{xtype:'spacer'}
]
},
{
xtype: 'nestedlist',
id:'idIncidentList',
onItemDisclosure:true,
cls:'clsNestedIncidentList',
toolbar:{id:'idNestedIncidentList'},
loadingText: "Loading Incidents...",
emptyText: "<div class=\"empty-text\">No Incidents Found.</div>",
getItemTextTpl: function() {
var tplConstructor =
'<tpl if="TKT_STATUS_NAME == \'CLOSED\'">'+
'<div class="vm_statusRed">'+
'</tpl>'+
'<tpl if="TKT_STATUS_NAME == \'OPENED\'">'+
'<div class="vm_statusYellow">'+
'</tpl>'+
'<tpl if="TKT_STATUS_NAME == \'ASSIGNED\'">'+
'<div class="vm_statusGreen">'+
'</tpl>'+
'<tpl if="TKT_STATUS_NAME == \'PENDING\'">'+
'<div class="vm_statusRed">'+
'</tpl>'+
'<tpl if="TKT_STATUS_NAME == \'RESOLVED\'">'+
'<div class="vm_statusOrange">'+
'</tpl>'+
'<tpl if="TKT_STATUS_NAME == \'REOPEN\'">'+
'<div class="vm_statusYellow">'+
'</tpl>'+
'<div class="vm_dvList"><h4 class="vm_txtName"><span class="vm_listHeader"><label>Inci.#{TKT_ID} by </label><label class="vm_txtFirstName"><i>{FIRST_NAME:ellipsis(15, true)}</i></label></span><div class="date vm_clsDate">{CREATED_ON:date("d-M-y H:i")}</div></h4>'+
'<div class="vm_title">{TKT_SUBJECT}</div>'+
'<div class="vm_subDesc">{TKT_DESC}</div></div></div>';
return tplConstructor;
},
store: {
type: 'tree',
fields: ['TKT_ID', 'CREATED_ON', 'FIRST_NAME', 'TKT_STATUS_NAME', 'TKT_SUBJECT', 'TKT_DESC', 'SEV_DESC', 'SERVICE_NAME', 'CATEGORY_NAME', {
name: 'leaf',
defaultValue: true
}],
root: {
leaf: false
},
data : localStorage.userIncidentData,
proxy: {
type: 'memory',
reader: {
type: 'json',
rootProperty: 'incidentList'
}
}
},
detailCard: {
xtype: "fieldset",
scrollable: true,
id: "idIncidentDetails",
items: [
{
xtype: 'textfield',
name: 'TKT_SUBJECT',
label: 'Subject',
labelAlign: 'top',
cls:'vm_textFields',
clearIcon:false,
disabled:true
},
{
xtype: 'textareafield',
name: 'TKT_DESC',
label: 'Description',
labelAlign: 'top',
cls:'vm_textFields',
clearIcon:false,
disabled:true
},
{
xtype: 'textfield',
name: 'SEV_DESC',
label: 'Impact',
labelWidth:'45%',
cls:'vm_textFields',
clearIcon:false,
disabled:true
},
{
xtype: 'textfield',
name: 'SERVICE_NAME',
id:'displayIncident',
cls:'vm_textFields',
label: 'IncidentType',
labelWidth:'45%',
disabled:true
},
{
xtype: 'textfield',
label: 'Category',
name: 'CATEGORY_NAME',
cls:'vm_textFields',
id:'getCategory',
labelWidth:'45%',
disabled:true
},
],
},
listeners: {
itemtap: function(nestedList, list, index, element, post) {
this.getDetailCard().items.items[0].setHtml(post._data.TKT_SUBJECT);
this.getDetailCard().items.items[1].setHtml(post._data.TKT_DESC);
this.getDetailCard().items.items[2].setHtml(post._data.SEV_DESC);
this.getDetailCard().items.items[3].setHtml(post._data.SERVICE_NAME);
this.getDetailCard().items.items[4].setHtml(post._data.CATEGORY_NAME);
}
}
},
{html:'No Incidents Found....',id:'idEmptyText'}],
},
initialize: function() {
this.callParent(arguments);
var incidentStore = Ext.getCmp('idIncidentList').getStore();
Ext.getCmp("idEmptyText").hide();
var getLoginData = localStorage.getItem('userData');
var parseData = JSON.parse(getLoginData);
var fname = parseData[0].FIRST_NAME;
var getIncidentData = localStorage.getItem('userIncidentData');
var parseIncidentData = JSON.parse(getIncidentData);
this.down("#idIncidentsListTitle").setTitle("Welcome, " + fname);
if(localStorage.userIncidentData != '[""]')
{
Ext.getCmp("idEmptyText").hide();
incidentStore.setData(localStorage.userIncidentData).load();
}
else
{
this.down("#inclist").hide();
this.down("#idEmptyText").show();
var msg = new Ext.MessageBox();
msg.show({
title: 'NO INCIDENTS FOUND',
message: 'No Incidents have reported by this user',
ui:'light',
cls: 'vm_error',
showAnimation: 'fadeIn',
hideAnimation: 'fadeOut',
buttons: [{text:'OK',itemId:'ok'}],
fn:function(){
Ext.emptyFn();
}
});
}
},
});
I need to get rid of this error as soon as possible ... Everything in my app is working fine from the second time onwards ... I think the problem is with the store i have defined ... Please help me guys ... Thanks in Advance ...!!!
My store is defined inline in my IncidentList View itself ...
store: {
type: 'tree',
fields: ['TKT_ID', 'CREATED_ON', 'FIRST_NAME', 'TKT_STATUS_NAME', 'TKT_SUBJECT', 'TKT_DESC', 'SEV_DESC', 'SERVICE_NAME', 'CATEGORY_NAME', {
name: 'leaf',
defaultValue: true
}],
root: {
leaf: false
},
data : localStorage.userIncidentData,
proxy: {
type: 'memory',
reader: {
type: 'json',
rootProperty: 'incidentList'
}
}
},
This is true: Object [object Object] has no method getRootNode
This method is no longer available in ST2, take a look at the API docs.
Actually, this is the only place in ST code that has this method left. Try editing sencha code in TreeStore
removeAll: function() {
this.getRootNode().removeAll(true);
this.callParent(arguments);
},
to
removeAll: function() {
this.getRoot().removeAll(true);
this.callParent(arguments);
},

Ext.Ajax.request Sencha Touch

I want to make a simple request like Ext.Ajax.request and display it in a list. But it does not work.
I have a URL like this
http://server/GetContacts.aspx?CustAccount=10019
Can someone tell me exactly how it works and what I should consider?
This is an example of what I get back.
{
"HasError": false,
"ErrorString": "",
"Data": [
{"ContactPersonId":"","Name":"","FirstName":"","MiddleName":"","LastName":"","Phone":"","CellularPhone":"","Telefax":"","Email":"","Url":"","Address":"","ZipCode":"","City":"","Street":"","Country":"","Function":""}
]
}
Ext.regModel('kunden', {
idProperty: 'id',
fields: [
{ name: 'ContactPersonId', type: 'string' },
.
.
.
{ name: 'Function', type: 'string' }
]
});
Ext.regStore('kundenStore', {
model: 'kunden',
sorters: [{
property: 'LastName'
}],
proxy: {
type: 'ajax',
url: 'http://server/GetContacts.aspx?CustAccount=10019'
},
reader: {
type: 'json',
root: 'Data'
}
});
NotesApp.views.kundenList = new Ext.List({
id: 'kundenList',
store: 'kundenStore',
grouped: true,
indexBar : true,
itemTpl: '<div class="list-item-title">{firstname} {lastname}</div>' +'<div class="list-item-narrative">{email}</div>',
listeners: {}
}
});
It can be so easily XP

sencha touch variables in other views

i have a .js file where i show a list of pools. And when i select a row i store the poolid of the selected row in a variable(this works fine).
And after you have selected a row an other view opens where you can see the guests which belongs to the pool. BUT to show this i need to use the poolid variable from the other view in this view. But how?
//The view where i select a pool
Dashboard = new Ext.Application({
name:'Dashboard',
launch: function(){
var poolId;
var thePanel = "allPool"
//------------------------------------List with Pool info
var detailPanel = new Ext.Panel({
id:'detailPanel',
layout:'fit',
items: [{
fullscreen:true,
xtype: 'list',
store: new Ext.data.Store({
model: 'team',
getGroupString : function(record) {
return record.get('name')[0];
},
proxy: new Ext.data.AjaxProxy({
url: 'a.php/pool/listPools',
method:'post',
reader: {
type: 'json',
root: 'data',
totalCount: 'count'
}
})
,autoLoad:true
}),
sorters: [{
property: 'name',
direction: 'asc'
}],
itemTpl:'<font size="4" face="Helvetica, Arial" color="black">{name}</font>',
grouped: true,
onItemDisclosure : true,
listeners : {
itemtap : function(record,index,item,e){
if (e.getTarget('.x-list-disclosure')) {
thePanel = 'guestsofPool';
poolId = this.store.data.items[index];
Ext.Ajax.request({
url : 'a.php/guest/listGuests' ,
params : {
poolId: poolId
},
method: 'POST',
success: function (result, request) {
var redirect = "showpool.php";
window.location = redirect;
},
failure: function ( result, request) {
alert(result.responseText);
}
});
//TopPanel.dockedItems.items[0].setTitle('Guests');
//outer.setActiveItem(1, { type: 'slide', cover: false, direction: 'right'});
}
// else { Ext.Msg.alert("Item clicked!");}
}
}
}]
})
//The view where you should see all the guests of the selected POOLID
ListDemo = new Ext.Application({
name: "ListDemo",
launch: function() {
ListDemo.detailPanel = new Ext.Panel({
id: 'detailpanel',
dock: "top",
items: [{
fullscreen:true,
xtype: 'list',
store: new Ext.data.Store({
model: 'team',
getGroupString : function(record) {
return record.get('name')[0];
},
proxy: new Ext.data.AjaxProxy({
url: 'a.php/guest/listGuests',
extraParams: {
poolId: thepoolid which was selected in the other view
},
method:'post',
reader: {
type: 'json',
root: 'data',
totalCount: 'count'
}
}),autoLoad:true
}),
sorters: [{
property: 'name',
direction: 'asc'
}],
itemTpl:'<font size="4" face="Helvetica, Arial" color="black">{name}</font>',
grouped: true,
onItemDisclosure : true,
listeners : {
itemtap : function(record,index,item,e){
if (e.getTarget('.x-list-disclosure')) {
//Ext.Msg.alert(index);
var redirect = 'showpool.php';
window.location = redirect;
}
// else { Ext.Msg.alert("Item clicked!");}
}
}
}]
});
I din't had patience to go through the complete code you posted. But what I'd suggest is have a variable in index.js file say var selectedPool_id; and in the itemTap set this id. and fetch the value wherever you need it.
NOTE: mak sure that the file index.js is added to your html file prior to the files that are selecting and usent he selectedPool_id.
This was a workaround. I welcome suggestions and improvements.