javascript ExtJs FormPanel - 如何使用内联声明的按钮提交表单?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/3865748/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
ExtJs FormPanel - How to submit form using buttons declared inline?
提问by Ronnie Overby
I'm getting started with ExtJs. I'm building a very simple login form:
我开始使用 ExtJs。我正在构建一个非常简单的登录表单:
Ext.onReady(function () {
Ext.QuickTips.init();
// turn on validation errors beside the field globally
Ext.form.Field.prototype.msgTarget = 'side';
var loginForm = new Ext.form.FormPanel({
url: '/Account/Login',
monitorValid: true,
labelWidth: 75,
frame: true,
title: 'Login',
width: 250,
defaultType: 'textfield',
defaults: { allowBlank: false },
items:
[{ fieldLabel: 'Username', name: 'username' },
{ fieldLabel: 'Password', name: 'password', inputType: 'password'}],
buttons:
[{
text: 'Login',
formBind: true,
handler: function (btn, evt) { /* how do i submit the form? */ }
}]
});
loginForm.render(document.body);
loginForm.el.center();
});
As you can see in the login button's handler function, I'm not quite sure how to submit the form. I have been pouring through the API documentation and have found some information about using the FormPanel's internal BasicForm submit method, but I'm not quite sure how to get at it. What am I missing?
正如您在登录按钮的处理函数中看到的那样,我不太确定如何提交表单。我一直在翻阅 API 文档,并找到了一些有关使用 FormPanel 的内部 BasicForm 提交方法的信息,但我不太确定如何获得它。我错过了什么?
回答by Ronnie Overby
This works:
这有效:
Ext.onReady(function () {
Ext.QuickTips.init();
// turn on validation errors beside the field globally
Ext.form.Field.prototype.msgTarget = 'side';
var loginForm = new Ext.form.FormPanel({
url: '/Account/Login',
monitorValid: true,
labelWidth: 75,
frame: true,
title: 'Login',
width: 250,
defaultType: 'textfield',
defaults: { allowBlank: false },
items: [
{ fieldLabel: 'Username', name: 'username' },
{ fieldLabel: 'Password', name: 'password', inputType: 'password'}
],
buttons: [
{
text: 'Login',
formBind: true,
handler: function (btn, evt) { loginForm.getForm().submit(); }
}
]
});
loginForm.render(document.body);
loginForm.el.center();
});
I didn't do this at first because referencing the formPanel variable while building the object felt weird, but I think it's ok to do it within a callback function.
我一开始没有这样做,因为在构建对象时引用 formPanel 变量感觉很奇怪,但我认为在回调函数中这样做是可以的。

