PDA

View Full Version : [3.3.0] Button with type 'submit'



Daniil
13 Sep 2010, 6:04 AM
Hello, team!

I would like to submit a form using this button:

new Ext.Button({
text: "Submit",
type: "submit"
});But when I'm clicking on this Button submitting doesn't happen.

I think it's because of e.preventDefault() in the onClick function:


onClick : function(e){
if(e){
e.preventDefault();
}
if(e.button !== 0){
return;
}
if(!this.disabled){
if(this.enableToggle && (this.allowDepress !== false || !this.pressed)){
this.toggle();
}
if(this.menu && !this.hasVisibleMenu() && !this.ignoreNextClick){
this.showMenu();
}
this.fireEvent('click', this, e);
if(this.handler){
//this.el.removeClass('x-btn-over');
this.handler.call(this.scope || this, this, e);
}
}
}
I'm not sure is this behavior normal?
If so, please tell what is the meaning of the type="submit" config option?

Or should I manually disable the onClick?

onClick:Ext.emptyFn

darthwes
13 Sep 2010, 6:23 AM
I don't think the general solution is a submit button. That's very html, not very Ext. In Ext, you would just have a button that does the submit. So you don't need to give it "type: 'submit'", it's a button. You have a handler for when the button is clicked. So you grab the form and submit it. No "submit" button necessary. PreventDefault prevents the browser's default handling of the event.

You need to make button code look like



new Ext.Button({
text: 'Submit',
handler: function(btn, evt) {
var frm = myForm.getForm(); //however you choose to acquire the form reference
frm.submit();
}
});


edit: See Animal below, it submits the form it's on. Ty @Animal.

Daniil
13 Sep 2010, 8:27 AM
Hi!

Thank you for the suggestion.
Yes, I know how to achieve this behavior.

It's rather a question about the meaning of type="submit" config option.
I'm trying to imagine a scenario where it would be helpful.

Animal
13 Sep 2010, 12:09 PM
Submit on enter. It will be triggered on enter.

laurentParis
13 Sep 2010, 3:57 PM
I'm not sure to understand but I suppose that you appreciate to used traditionnal submit button !

To do that, you need to use BasicForm !

follow this link
www.sencha.com/forum/showthread.php?75999-OPEN-771-BasicForm.-submitOnEnter-config&highlight=Ext.form.BasicForm (http://www.sencha.com/forum/showthread.php?75999-OPEN-771-BasicForm.-submitOnEnter-config&highlight=Ext.form.BasicForm)

Thanks to animal )

Daniil
15 Sep 2010, 8:54 AM
Thank you all!
Now I know many ways to submit a form:)

Animal
15 Sep 2010, 9:29 AM
I'm not sure to understand but I suppose that you appreciate to used traditionnal submit button !

To do that, you need to use BasicForm !

follow this link
www.sencha.com/forum/showthread.php?75999-OPEN-771-BasicForm.-submitOnEnter-config&highlight=Ext.form.BasicForm (http://www.sencha.com/forum/showthread.php?75999-OPEN-771-BasicForm.-submitOnEnter-config&highlight=Ext.form.BasicForm)

Thanks to animal )

A FormPanel encapsulates a BasicForm