Às vezes, você precisa selecionar um intervalo de data no ExtJS, que requer julgamento automático. A data de início selecionada não pode ser maior que a data de término, ou a data de término não pode ser menor que a data de início. O código implementado é o seguinte
Imagem de reprodução:
Como pode ser visto na figura acima, quando um horário de início for selecionado, o intervalo de seleção do horário final será automaticamente limitado e a ligação entre os dois seletores de data será realizada.
O código é o seguinte:
Primeiro defina a função de processamento de ligação:
Ext.Apply (ext.form.field.vtypes, {periodange: function (val, campo) {var date = field.parsedate (val); if (! Date) {return false;} if (field.startdatefield && (! This Daterangemax || (date.gettime ()! Field.Up (Grid '). campo.Up ('grade'). Down ('#' + Field.enddatefield); end.setminValue (data); end.validate (); this.daterrangemin = data; } retornar true; }, periodangeText: 'A data de início deve ser menor que a data final'}); Ext.tip.quicktipmanager.init ();Adicione itens em TBAR, BBAR ou formulário:
{ xtype: 'datefield', fieldLabel: 'time range start', name: 'startdt', id: 'startdt', vtype: 'daterange', endDateField: 'enddt', format: 'Ym-d', width: 220, labelWidth: 90, msgTarget: 'side', autoFitErrors: false }, { xtype: 'datefield', Fieldlabel: 'end', nome: 'enddt', id: 'enddt', vtype: 'daterange', startdatefield: 'startdt', formato: 'ym-d', width: 170, labelwidth: 40, msgTarget: 'lateral', teptrors: 170, {xtype: xty: 'msgTarget:' lateral ', Autofiterrors: False', {xtype: xty: xty: 'MSGTarget:' Side ', Autofiterrors: False', {xtype: xty: xty: ' manipulador: function () {...Este código pode ser copiado para EXTJS4.1.1 para executar