Results 1 to 3 of 3

Thread: How to submit form

  1. #1

    Default How to submit form

    How can I submit touch form to get to the next page
    I do this thing by following in ext/js
    Code:
    handler: function() {
    								formBase.getForm().getEl().dom.action = 'IntroFrom.aspx';
    	       						formBase.getForm().getEl().dom.method = 'POST';
                    				formBase.getForm().submit();
                                    
                                }
    my code is
    Code:
     formBase = {
                scroll: 'vertical',
                url: 'postUser.php',
                standardSubmit: false,
                items: [
                        {
                        xtype: 'fieldset',
                        title: 'Select Provider',
                        //instructions: 'Please enter the information above.',
                        defaults: {
                            required: true,
                            labelAlign: 'left',
                            labelWidth: '70%'
                        },
                        items: [
                        {
                            xtype: 'selectfield',
                            name: 'name',
                            label: '1. What physician will see you today? ',
                            useClearIcon: false,
                            autoCapitalize: false,
    						valueField : 'rank',
                            displayField : 'title',
                            store : ranksStore
                        }]
                        }
                ],
                listeners: {
                    submit: function(form, result) {
                        console.log('success', Ext.toArray(arguments));
                    },
                    exception: function(form, result) {
                        console.log('failure', Ext.toArray(arguments));
                    }
                },
                dockedItems: [
                    {
                        xtype: 'toolbar',
                        dock: 'bottom',
                        items: [
                            /*{
                                text: 'Load Model',
                                ui: 'round',
                                handler: function() {
                                    formBase.user = Ext.ModelMgr.create({
                                        'name': 'Akura',
                                        'datePickerValue': 'dsfds',
                                    }, 'User');
    
                                    form.loadModel(formBase.user);
                                }
                            },*/
                            {xtype: 'spacer'},
                            {
                                text: 'Reset',
                                handler: function() {
                                    form.reset();
                                }
                            },
                            {
                                text: 'Next',
                                ui: 'confirm',
                                handler: function() {
    								??????????????
                                    
                                }
                            }
                        ]
                    }
                ]
            };
    What the code to write in question mark to get to next form/page/html file after clicking NEXT button.

  2. #2
    Sencha Premium Member
    Join Date
    Jan 2011
    Location
    Dundas, Ontario, Canada
    Posts
    84

    Default

    This is what I use.. I don't have a second screen but you could easily pair form.hide() with something like formPageTwo.show();

    Code:
            var form; 
                
            var ContactFormBase = {
                    scroll: 'vertical',
                    url: 'index.php',
                    standardSubmit: false,
    
                    /* ... and so on */
    
                        listeners : {
                                       submit : function(form, result){
                                           console.log('success', Ext.toArray(arguments));
                                       },
                                       exception : function(form, result){
                                           console.log('failure', Ext.toArray(arguments));
                                       }
                                   },
                    dockedItems: [
                    {
                        xtype: 'toolbar',
                        dock: 'top',
                        items: [{
                            text: 'Cancel',
                            handler: function() {
                                form.hide('pop');
                                }
                            },
                            {
                            text: 'Reset',
                            handler: function() {
                                form.reset();
                                }
                            },
                            { xtype: 'spacer' },
                            {
                            text: 'Send',
                            ui: 'confirm',
                            handler: function() {
                                    form.submit({
                                        waitMsg: {message: 'Submitting', cls: 'demos-loading'}
                                    });
                                    Ext.Msg.alert('Sent!','Your message has been sent.', form.hide());
                                }
                            
                        }]
                    }
                    ]
                    
                            
                
                };
    
                form = new Ext.form.FormPanel(ContactFormBase);
    so perhaps have a second form show as the first is accepted by the server, but having a second form object made..

    Code:
    formPageTwo = new Ext.form.FormPanel(ContactFormBasePageTwo);
    then adding to the .hide() a .show() for the second form. There's probably better and more elegant ways, but that's how I'd probably try it first.

  3. #3
    Touch Premium Member
    Join Date
    Feb 2008
    Posts
    206

    Default

    Call form.submit() in your Next button handler. Then in your submit listener, load the next view. Assuming your form is part of a panel with a card layout something like this.parentCt.next() should work.

Similar Threads

  1. form.submit is not a function [Break on this error] form.submit();
    By intro in forum Ext 3.x: Help & Discussion
    Replies: 2
    Last Post: 30 Aug 2010, 11:03 AM
  2. form.submit doesn't call url in form submit action
    By webwolfi in forum Ext 2.x: Help & Discussion
    Replies: 0
    Last Post: 26 Apr 2009, 10:16 AM
  3. tree: submit checkboxes with form.submit
    By perler in forum Ext 2.x: Help & Discussion
    Replies: 1
    Last Post: 24 Mar 2008, 4:49 AM
  4. Form without submit button, handling submit with shift+enter...
    By violinista in forum Ext 1.x: Help & Discussion
    Replies: 4
    Last Post: 5 Jun 2007, 12:02 AM
  5. ID of submit within form masks submit function
    By aconran in forum Ext 1.x: Help & Discussion
    Replies: 1
    Last Post: 19 Feb 2007, 12:08 AM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •