Form - Submit Button

[moonpeep]

I'm definitely a novice, so bear with my pieced together code. I'm not sure where to go from here - my form displays as an overlay when a button is clicked, the form works fine in straight html, but nothing submits using what I have below. Working on this for teachers at my school.

I removed the google key for this post.

Any help would be greatly appreciated!

//6th Button Begin                    
                        {
                            xtype: 'button',
                            cls: '6thbutton',
                            height: 85,
                            width: 475,
                            text: 'Submit 6th Grade Report',
                            ui: 'confirm',
                            handler: function() {




        


        
        var formBase = {
            scroll: 'none',
            url   : 'https://docs.google.com/a/.../spreadsheet/formResponse?formkey=...',
            standardSubmit : false,
            items: [{
                    xtype: 'fieldset',
                    title: '6th Grade Behavior',
                    items: [{
                        xtype: 'selectfield',
                        name: 'entry.3.single',
                        options: [
                            {text: '(Choose Teacher)',  value: '(Choose Teacher)'},
                            {text: 'Mr. Guy', value: 'Mr. Guy'}
                        ]
                    },
                    {
                        xtype: 'selectfield',
                        name: 'entry.0.single',
                        options: [
                            {text: '(Choose Student)',  value: '(Choose Student)'},
                            {text: 'Joe', value: 'Joe'}
                        ]
                    },
                    {
                        xtype: 'selectfield',
                        name: 'entry.2.single',
                        options: [
                            {text: '(Choose Behavior)',  value: '(Choose Behavior)'},
                            {text: 'Bad', value: 'Bad'}
                        ]
                    }]
                }
            ],
        
            dockedItems: [
                {
                    xtype: 'toolbar',
                    dock: 'bottom',
                    items: [
                        {
                            text: 'Cancel',
                            height: 35,
                            width: 100,
                            ui: 'decline',
                        scope : this,
                        handler : function(){
                            form.hide();
                        }                      },
                        {xtype: 'spacer'},








//Submit Button Begin
                        {
                            text: 'Send',
                            height: 35,
                            width: 100,
                            ui: 'confirm',
                            handler: function() {
                                form.submit({
                                    method : 'POST',
                                    waitMsg : {message:'Submitting', cls : 'demos-loading'},
                                    success : function() {
                                        Ext.Msg.alert('Thank You', 'Your report has been received', function() {
                                            form.hide();
                                        });
                                    }




                                });
                            }
//Submit Button End








                        }
                    ]
                }
            ]
        };
        
        if (Ext.is.Phone) {
            formBase.fullscreen = true;
        } else {
            Ext.apply(formBase, {
                autoRender: true,
                floating: true,
                modal: true,
                centered: true,
                hideOnMaskTap: false,
                height: 385,
                width: 480
            });
        }
        
        form = new Ext.form.FormPanel(formBase);
        form.show();
    }
                        },
//6th Button End

[mitchellsimoens]

Yeah... not too sure where your button is actually at....

In the handler of the button, the button instance is past as the first argument. From the button, you have to go up to the form via:

handler : function(btn) {
    var form = btn.up('formpanel');

    form.submit({...});
}

[moonpeep]

Hmm. Thanks for the reply. The Send button is a toolbar item within an overlay. I tried this, but no luck:

                        {
                            xtype: 'button',
                            text: 'Send',
                            height: 35,
                            width: 100,
                            ui: 'confirm',
                            handler: function(btn) {
                                var form = btn.up('formpanel');
                                form.submit({
                                    method : 'POST',
                                    waitMsg : {message:'Submitting', cls : 'demos-loading'},
                                    success : function() {
                                        Ext.Msg.alert('Thank You', 'Your report has been received', function() {
                                            form.hide();
                                        });
                                    }




                                });
                            }

Do I need to change it to a button in some other way, or name the button somehow? Sorry for my total ignorance.

Thanks!