model - How to create login in Sencha Touch -


i'm newbie in sencha , i've create login.js. have problem don't know how keep data , database sencha touch compatible with. please assist me how store,model , controller.

login.js

ext.define('realapp.view.login', { extend: 'ext.form.panel', alias: "widget.loginview", requires: ['ext.form.fieldset', 'ext.form.password', 'ext.label'], config: {     title: 'login',     scrollable: false,     items: [         {             xtype: "toolbar",             docked: "top",             title: "login",             items: [                 {                     xtype: "button",                     ui: "back",                     text: "home",                     itemid: "backbutton",                     width: 120,                     height: 25                 },                 { xtype: "spacer" },                 {                     xtype: "button",                     ui: "action",                     text: "sign up",                     itemid: "signupbutton",                     width: 120,                     height: 25                 }             ]         },         {             xtype: 'label',             html: 'login failed. please enter correct credentials.',             itemid: 'signinfailedlabel',             hidden: true,             hideanimation: 'fadeout',             showanimation: 'fadein',             style: 'color:#990000;margin:5px 0px;'         },         {             xtype: 'fieldset',             title: 'login',             items: [                 {                     xtype: 'textfield',                     store: "login",                     placeholder: 'username',                     itemid: 'usernametextfield',                     name: 'usernametextfield',                     required: true,                     itemtpl: "{username}"                 },                 {                     xtype: 'passwordfield',                     store: "login",                     placeholder: 'password',                     itemid: 'passwordtextfield',                     name: 'passwordtextfield',                     required: true,                     itemtpl: "{password}"                 }             ]         },         {             xtype: "toolbar",             docked: "bottom",             layout: {                 pack: 'center'             },             items: [                 {                     xtype: 'button',                     itemid: 'loginbutton',                     ui: 'action',                     text: 'log in',                     width: 120,                     height: 25                 }             ]         }      ],     listeners: [{         delegate: '#loginbutton',         event: 'tap',         fn: 'onloginbuttontap'     },     {         delegate: "#backbutton",         event: "tap",         fn: "onbackbuttontap"     },     {         delegate: "#signupbutton",         event: "tap",         fn: "onsignupbuttontap"     }] }, onloginbuttontap: function () {     console.log("gologcommand");     this.fireevent("gologcommand", this); }, onsignupbuttontap: function () {     console.log("signupcommand");     this.fireevent("signupcommand", this); }, onbackbuttontap: function () {     console.log("backtohomecommand");     this.fireevent("backtohomecommand", this); }}); 

register.js

ext.define('realapp.view.register', { extend: 'ext.form.panel', alias: "widget.registerview", requires: ['ext.form.fieldset', 'ext.form.password', 'ext.label', 'ext.util.delayedtask'], config: {     title: 'register',     scrollable: false,     items: [         {             xtype: "toolbar",             docked: "top",             title: "register",             items: [                 {                     xtype: "button",                     ui: "back",                     text: "back",                     itemid: "backbutton",                     width: 120,                     height: 25                 }             ]         },         {             xtype: 'fieldset',             title: 'register',             items: [                 {                     xtype: 'textfield',                     label: 'username',                     store: "login",                     itemid: 'usernametextfield',                     name: 'usernametextfield',                     required: true,                 },                 {                     xtype: 'passwordfield',                     label: 'password',                     store: "login",                     itemid: 'passwordtextfield',                     name: 'passwordtextfield',                     required: true,                 }             ]         },         {             xtype: "toolbar",             docked: "bottom",             layout: {                 pack: 'center'             },             items: [                 {                     xtype: "button",                     ui: "action",                     text: "register",                     itemid: "registerbutton",                     width: 120,                     height: 25                 }             ]         }     ],     listeners: [{         delegate: '#registerbutton',         event: 'tap',         fn: 'onregisterbuttontap'     },     {         delegate: "#backbutton",         event: "tap",         fn: "onbackbuttontap"     }] }, onregisterbuttontap: function () {     console.log("registercommand");     this.fireevent("registercommand", this); }, onbackbuttontap: function () {     console.log("backcommand");     this.fireevent("backcommand", this); }}); 

take @ little demo created you, stores username , password in local storage. maybe help.

http://www.senchafiddle.com/#trfry


Comments

Popular posts from this blog

html - How to style widget with post count different than without post count -

How to remove text and logo OR add Overflow on Android ActionBar using AppCompat on API 8? -

javascript - storing input from prompt in array and displaying the array -