So erhalten Sie den Feld Feldwert in der Onclick -Veranstaltung
Frage
Ich benutze diesen Architekturartikel http://blog.extjs.eu/know-how/writing-a-big-application-in-ext/
in meinem Code:
Ich habe diese Anwendung.
Ext.apply(Ext.form.VTypes, {
daterange : function(val, field) {
var date = field.parseDate(val);
if(!date){
return false;
}
if (field.startDateField) {
var start = Ext.getCmp(field.startDateField);
if (!start.maxValue || (date.getTime() != start.maxValue.getTime())) {
start.setMaxValue(date);
start.validate();
}
}
else if (field.endDateField) {
var end = Ext.getCmp(field.endDateField);
if (!end.minValue || (date.getTime() != end.minValue.getTime())) {
end.setMinValue(date);
end.validate();
}
}
/*
* Always return true since we're only using this vtype to set the
* min/max allowed values (these are tested for after the vtype test)
*/
return true;
}
});
Application.DashBoardForm= Ext.extend(Ext.FormPanel, {
border:false
,initComponent:function() {
var config = {
labelWidth: 125,
frame: true,
title: 'Date Range',
bodyStyle:'padding:5px 5px 0',
width: 350,
defaults: {width: 175},
defaultType: 'datefield',
items: [{
fieldLabel: 'Start Date',
name: 'fromdate',
id: 'fromdate',
vtype: 'daterange',
value : new Date(),
endDateField: 'todate' // id of the end date field
},{
fieldLabel: 'End Date',
name: 'todate',
id: 'todate',
vtype: 'daterange',
value : new Date(),
startDateField: 'fromdate' // id of the start date field
}]
,buttons: [{
text: 'Go',
onClick : function () {
// here i want to access the value of the form field
// how can i access the fromdate value so that i pass it to grid
console.log(this.getForm());
var win = new Ext.Window({
items:{xtype:'DashBoardGrid',fromdate:this}
});
win.show();
}
}]
}; // eo config object
// apply config
Ext.apply(this, Ext.apply(this.initialConfig, config));
Application.DashBoardForm.superclass.initComponent.apply(this, arguments);
} // eo function initComponent
,onRender:function() {
// this.store.load();
Application.DashBoardForm.superclass.onRender.apply(this, arguments);
} // eo function onRender
});
Ext.reg('DashBoardForm', Application.DashBoardForm);
Wie kann ich den Wert von Datum hier in der Onclick -Funktion bestehen?
Lösung
Da Sie dem Feld eine ID von "Fromdate" gegeben haben, können Sie es mit ext.getCmp () verweisen und von dort aus der Methode von GetValue () aufrufen:
var field = Ext.getCmp('fromdate');
var win = new Ext.Window({
items: {
xtype: 'DashBoardGrid',
fromdate: field.getValue()
}
});
Andere Tipps
Stellen Sie den Umfang Ihrer Schaltfläche "GO" fest, damit Sie innerhalb der Handler -Methode zugreifen können. Auf diese Weise haben Sie von der Handler -Methode Zugriff auf das Formular.
Um Zugang zum Formularelement zu erhalten, können Sie nun verwenden ref
Eigenschaft oder Verwendung find*()
Methoden verfügbar in Ext.form.FormPanel
um das Formularelement zu bekommen.
text: 'Go',
scope: this,
handler: function () {
fromdate = this.findById('fromdate');
// extract date value and use it...
value = fromdate.getValue();
}
Legen Sie bei der Verwendung von Ref -Eigenschaften einen Ref für das Feld FormData fest:
ref: '../formdate'
fieldLabel: 'Start Date',
name: 'fromdate',
id: 'fromdate',
vtype: 'daterange',
value : new Date(),
endDateField: 'todate' // id of the end date field
Und Sie sollten in der Lage sein, über das Formularobjekt im Handler auf das Formularelement zugreifen zu können.
this.formdate.getValue()