submit external form and fort GET or POST metod

[italoc]

i would like a login module in EXTJS but when i press login button i would like to pass the variable to external php pages.. i can force to redirect the pages when i press the login button but the variable don't are passed to destination page.

this is my code

new Ext.FormPanel({
                    labelWidth: 50, 
                    url:'save-form.php',
                    frame:true,
                    collapsible: true,
                    title: 'Login',
                    bodyStyle:'padding:5px 5px 0',
                    width: 225,
                    defaults: {width: 140},
                    defaultType: 'textfield',
            
                    items: [{
                            fieldLabel: 'Username',
                            name: 'username',
                            allowBlank:false
                        },{
                            fieldLabel: 'Password',
                            name: 'password',
                            inputType:'password',
                            allowBlank:false
                        }
                    ],
            
                    buttons: [{
                        text:'Login',
                        type: 'submit',
                handler: function() {
                        			window.location.href = 'http://host/index.php';
	},				
                             }]
                  })

if i write method: 'POST', or GET nothing change...

please help me...

[Condor]

Try:

buttons: [{
  text:'Login',
  handler: function() {
    formPanel.getForm().submit({
      success: function() {
        window.location.href = 'http://host/index.php';
      }
    });
  }
}]

(this assumes that save-form.php produces the correct response, see docs)

Another option would be to do a classic submit (see docs).

[italoc]

i try this:

buttons: [{
text:'Login',
handler: function() {
formPanel.getForm().submit({
success: function() {
window.location.href = 'http://host/index.php';
}
});
}
}]

but i receive always an error:

formPanel is not defined
[Break on this error] });

can you post an example of save-form.php configuration? i try to read a docs, but i don't find a solution...

thanks..

[Condor]

formPanel should be your FormPanel. If you don't want to store it in a variable you could give it and id and use Ext.getCmp(id).

[italoc]

very strange... i have modified the code in this way

new Ext.FormPanel({
                    labelWidth: 50, 
                    url:'save-form.php',
                    frame:true,
                    collapsible: true,
                    title: 'Login',
                    bodyStyle:'padding:5px 5px 0',
                    width: 225,
                    defaults: {width: 140},
                    defaultType: 'textfield',
                    method: 'GET',
                    id: 'my-form',
                    items: [{
                            fieldLabel: 'Username',
                            name: 'username',
                            allowBlank:false
                        },{
                            fieldLabel: 'Password',
                            name: 'password',
                            inputType:'password',
                            allowBlank:false
                        }
                    ],
            
                            buttons: [{
                            text:'Login',
                            handler: function() {
                            formPanel = Ext.getCmp('my-form');
                              formPanel.getForm().submit({
                                success: function() {
                                  window.location.href = 'http://host/index.php';
                                }
                              });
                            }
                          }]

now the Login form pannel doesn't appear.. if i delete id: 'my-form', the form apper but don't work

any other solution??

[Condor]

1. The form should appear, even with the id (unless you already used this id elsewhere).
2. Your server probably doesn't handle the submit correctly, try:

buttons: [{
	text:'Login',
	handler: function() {
		Ext.getCmp('my-form').getForm().submit({
			success: function() {
				window.location.href = 'http://host/index.php';
			},
			failure: function(form, action) {
				alert(action.failureType);
			}
		});
	}
}],

[italoc]

when i set ANY id name in formpanel the form dont' appear...

i don't know why.. i have try whit many different name without success..


the same result i try to declear the formpanel in variable....

[Condor]

Your code (WITH the id and my changes to the button handler) runs fine on my PC. Are you sure the problem isn't elsewere?

[italoc]

i post you my entire script if set ID or variable name for formpanel this doesn't appear, i don't know where can be a problemm...

thanks

<script type="text/javascript">
		
			function load()
			{
			mapInit(45.70126277777778,9.67772388888889); // bergamo
	        var zoomControl = new YSliderControl();//creo un nuovo controller
	        g_map.removeControl(zoom);//dalla variabile globale recupero l'oggetto dello zoom e lo elimino
	        g_map.addControl(zoomControl, topLeftClosed);
	        zoom=zoomControl;//aggiorno i riferimenti globali
			}
							 
		</script>




<script type="text/javascript">
    Ext.onReady(function(){

        Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
        
       var viewport = new Ext.Viewport({
            layout:'border',
            items:[
                new Ext.BoxComponent({ // raw
                    region:'north',
                    el: 'north',
                    height:32
                }),{
                    region:'south',
                    contentEl: 'south',
                    split:true,
                    height: 100,
                    minSize: 100,
                    maxSize: 200,
                    collapsible: true,
                    title:'South',
                    margins:'0 0 0 0'
                }, {
                    region:'east',
                    title: 'Dati Utente',
                    collapsible: true,
                    split:true,
                    width: 225,
                    minSize: 175,
                    maxSize: 400,
                    layout:'column',
                    layoutConfig:{
                        animate:true
                        },
                    margins:'0 5 0 0',
                    items: [
                    new Ext.FormPanel({
                    labelWidth: 50, 
                    url:'save-form.php',
                    frame:true,
                    collapsible: true,
                    title: 'Login',
                    bodyStyle:'padding:5px 5px 0',
                    width: 225,
                    defaults: {width: 140},
                    defaultType: 'textfield',
                    method: 'GET',
                    //id: 'a',
                    items: [{
                            fieldLabel: 'Username',
                            name: 'username',
                            allowBlank:false
                        },{
                            fieldLabel: 'Password',
                            name: 'password',
                            inputType:'password',
                            allowBlank:false
                        }
                    ],
            
                            buttons: [{
                            text:'Login',
                            handler: function() {
                            Ext.getCmp('').getForm().submit({
                          			success: function() {
                          				window.location.href = 'http://host/index.php';
                          			},
                          			failure: function(form, action) {
                          				alert(action.failureType);
                          			}
                              });
                            }
                          }]
                  }),{    
					  	title: 'Sponsor',
				        collapsible:true,
				        autoScroll:true,
        				width:225,
				        html: 'example...'		
		           }]},{
                    region:'west',
                    id:'west-panel',
                    title:'West',
                    split:true,
                    width: 200,
                    minSize: 175,
                    maxSize: 400,
                    collapsible: true,
                    margins:'0 0 0 5',
                    layout:'column',
                    layoutConfig:{
                    animate:true
                    },
                    items: [{
                        contentEl: 'west',
                        title: 'Ricerca',
				        collapsible:true,
				        autoScroll:true,
        				width:200,
				        html: 'example....' 
                        
                  },{
					  	title: 'Gategorie',
				        collapsible:true,
				        autoScroll:true,
        				width:200,
				        html: 'example....'		
		           }]
                },
                new Ext.TabPanel({
                    region:'center',
                    deferredRender:false,
                    activeTab:0,
                    items:[{
                        contentEl:'center2',
                        title: 'Mappa',
                        autoScroll:true
                     }]
                })
             ]
        });
        Ext.get("hideit").on('click', function() {
           var w = Ext.getCmp('west-panel');
           w.collapsed ? w.expand() : w.collapse(); 
        });
    });
	</script>

[Condor]

If I uncomment id:'a' and change Ext.getCmp('a') the form shows and posts data.