1. #1
    Sencha User
    Join Date
    Feb 2012
    Posts
    13
    Vote Rating
    0
    warkesm is on a distinguished road

      0  

    Default Submit Login Form using Sencha Touch 2 Beta

    Submit Login Form using Sencha Touch 2 Beta


    Hello Friends,

    Could you please help me to create a Login Form using Sencha Touch 2 Beta
    I have created UI following some tutorials (
    http://docs.sencha.com/touch/2-0/#!/...etting_started, http://docs.sencha.com/touch/2-0/#!/api/Ext.form.Panel) but now can't access the form data or send it to the controller
    It has to be done in MVC pattern (
    http://docs.sencha.com/touch/2-0/#!/guide/apps_intro) but I couldn't achieved that.
    And index.html has included only
    Code:
    <link rel="stylesheet" href="resources/css/senchatouch/sencha-touch.css" type="text/css">
        <script type="text/javascript" src="lib/senchatouch/sencha-touch.js"></script>
        <script type="text/javascript" src="lib/senchatouch/all-classes.js"></script>
        <script type="text/javascript" src="Test.js"></script>


    /*
    Code:
    Ext.application({
        name: 'MyBulle',
        launch: function() {    
            Ext.create('Ext.form.Panel', {
                   fullscreen: true,
                   items: 
                [
                    {
                        xtype: 'fieldset',
                        defaults: 
                        {
                            labelWidth: '35%'
                        },
                        instructions: '(Provide credentials to login)',
                        items: 
                        [
                            {
                                xtype: 'textfield',
                                id: 'username',
                                name : 'userName',
                                label: 'Username', 
                                value: 'user',
                                allowBlank:false                                                    
                            },
                            {
                                xtype: 'passwordfield',
                                id: 'password',
                                name : 'password',
                                label: 'Password',
                                value: 'sometext'                        
                            },
                            {
                                xtype: 'textfield',
                                id: 'serverurl',
                                name : 'server',
                                label: 'Server',
                                value: 'http://user.domain.com'
                            }
                        ]//END ITEMS                    
                    },
                    {
                        xtype: 'button',
                        text: 'Login',
                        width: '30%',
                        left: '100px',
                        ui: 'confirm',
                        handler: function(sender,event){
                            alert('Submitted Login Form');
    
                        }//END HANDLER
                    }
                ]//END ITEMS FIELDSET
            });//END CREATE
        }//END LAUNCH
    });//END APPLICATION[/QUOTE]
    */
    
    OR /* [QUOTE]Ext.setup ({ onReady: function() { Ext.Viewport.add ({ xtype: 'formpanel', title: 'Login', dockedItems: [ { xtype: "toolbar", dock: "top", title: "MyBulle Login" } ],//END DOCKEDITEMS items: [ { xtype: 'fieldset', defaults: { labelWidth: '38%' }, instructions: '(Provide credentials to login)', items: [ { xtype: 'textfield', id: 'username', name : 'userName', label: 'Username', value: 'user', allowBlank:false }, { xtype: 'passwordfield', id: 'password', name : 'password', label: 'Password', value: 'sometext' }, { xtype: 'textfield', id: 'serverurl', name : 'server', label: 'Server', value: 'http://user.domain.com' } ]//END ITEMS }, { xtype: 'button', text: 'Login', width: '30%', left: '100px', ui: 'confirm', handler: function(sender,event){ alert('Submitted Login Form'); } } ],//END ITEM FIELDSET initComponent: function() { alert('login initComponent'); } }); }//END ONREADY FUNCTION });
    */

    The form data needs to be provided as parameters to POST API

    Code:
    Ext.Ajax.request({
        url: 'http://192.168.0.75/project_folder/php/api.php?method=loginprofile', 
        //only method will be as GET parameter userName and password will be POST parameters
        actionMethods:'POST',
        params: {
            profile: 'mbosf',
            //password: '21bd12dc183f74320esdfe76f27b78eb39c8ad972a757' // working as pwd is encrypted
            password: sha1Hash('sometext') // not working
        },
        success: function(response, opts) {    
            alert(response.responseText);      
        },
        failure: function(response, opts) {
            alert('Login Failed');
        }
    });


    It would be a great help if you can give any clue or hint to proceed.


    Thank You !
    - Sachin Warke
    Last edited by mitchellsimoens; 7 Feb 2012 at 9:12 AM. Reason: Switch [QUOTE] to [CODE]

  2. #2
    Sencha User
    Join Date
    Jan 2011
    Posts
    134
    Vote Rating
    5
    JRS is on a distinguished road

      0  

    Thumbs up This video does has an example of forms

    This video does has an example of forms


    Hello,

    This video has an example of handling forms.
    http://vimeo.com/33311074

    I
    believe the video was created using PR1 version - so you need to do some modifications for B1. I got it to work in Beta 1. I believe most of the mods were to refs and configs.

    Hope this helps - Good luck
    JRS

  3. #3
    Sencha User
    Join Date
    Feb 2012
    Posts
    13
    Vote Rating
    0
    warkesm is on a distinguished road

      0  

    Default


    Thank You So Much !
    This video teaches step by step implementation of MVC pattern in Sencha Touch.
    As you mentioned there are some changes as xtype: 'image' is not working in carousel and on submitting LoginForm from view, it's not handled in controller but I'm not getting what are the replacements for these changes.
    I'm using Sencha in Android, console.log is not writing log that's why debugging with alerts. We get an alert as 'called init of controller Main' when app starts but not showing next alert message on submitting login form.
    Could you tell me where am I going wrong?

    View JS
    Ext.define('Sencha.view.Home',{
    extend: 'Ext.Panel',
    xtype: 'LoginForm',

    config: {
    title: 'Home',
    iconCls: 'home',


    items: [
    {
    xtype: 'fieldset',
    defaults:
    {
    labelWidth: '32%'
    },
    instructions: '(Please provide all credentials to login)',
    layout: {
    type: 'vbox'
    },
    items:
    [
    {
    xtype: "toolbar",
    dock: "top",
    title: "Login To Sencha"
    },
    {
    xtype: 'textfield',
    id: 'username',
    name : 'userName',
    label: 'Username',
    value: 'user',
    allowBlank:false
    },
    {
    xtype: 'passwordfield',
    id: 'password',
    name : 'password',
    label: 'Password',
    value: 'sometext'
    },
    {
    xtype: 'textfield',
    id: 'serverurl',
    name : 'server',
    label: 'Server',
    value: 'http://user.domain.com'
    }
    ]//END ITEMS
    },
    {
    xtype: 'button',
    ui: 'confirm',
    text: 'Login',
    width: '30%',
    left: '100px',
    action: 'submitLogin'
    }
    ]
    }//END CONFIG
    });
    Controller JS
    Ext.define('Sencha.controller.Main',{
    extend: 'Ext.app.Controller',
    views: ['Home'],

    init: function(){
    alert('called init of controller Main');

    this.control({
    'button[action=submitLogin]': {
    top: 'submitLoginForm'
    }
    });
    },
    submitLoginForm: function() {
    alert('Submitted Login Form');
    }

    });
    Thank You !
    - Sachin Warke

  4. #4
    Sencha User
    Join Date
    Feb 2012
    Posts
    13
    Vote Rating
    0
    warkesm is on a distinguished road

      0  

    Default


    Oops Sorry My Mistake
    It was spell mistake in Main.js,

    Thank You JRS
    Thank You So Much

    Ext.define('Sencha.controller.Main',{
    extend: 'Ext.app.Controller',
    views: ['Home'],

    init: function(){
    this.control({
    'button[action=submitLogin]': {
    tap: 'submitLoginForm'
    }
    });
    },
    submitLoginForm: function() {
    alert('Submitted Login Form');
    }

    });

  5. #5
    Sencha User
    Join Date
    Jan 2011
    Posts
    134
    Vote Rating
    5
    JRS is on a distinguished road

      0  

    Default Glad it worked out

    Glad it worked out


    Warkesm,

    Glad everything worked out. Thanks should go to Ed Spencer and the ST video folks.

    Good luck
    JRS

Thread Participants: 1

Tags for this Thread

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar