mirror of
https://github.com/silverstripe/silverstripe-framework
synced 2024-10-22 14:05:37 +02:00
MINOR Moved NumericField? javascript logic from CalendarDateField?.js into new NumericField?.js. Removed unused DMYCalendarDateField javascript logic, the field behaves just fine with standard input fields and no auto-focus magic on the input fields. (merged from branches/2.3-nzct)
git-svn-id: svn://svn.silverstripe.com/silverstripe/open/modules/sapphire/trunk@82061 467b73ca-7a2a-4603-9d3b-597d59a354a9
This commit is contained in:
Ingo Schommer
parent
8a20d5c1ad
commit
11b30e8db9
@ -16,6 +16,7 @@ class DMYCalendarDateField extends CalendarDateField {
|
|||||||
Requirements::javascript(THIRDPARTY_DIR . "/calendar/calendar-setup.js");
|
Requirements::javascript(THIRDPARTY_DIR . "/calendar/calendar-setup.js");
|
||||||
Requirements::css(SAPPHIRE_DIR . "/css/CalendarDateField.css");
|
Requirements::css(SAPPHIRE_DIR . "/css/CalendarDateField.css");
|
||||||
Requirements::css(THIRDPARTY_DIR . "/calendar/calendar-win2k-1.css");
|
Requirements::css(THIRDPARTY_DIR . "/calendar/calendar-win2k-1.css");
|
||||||
|
Requirements::javascript(SAPPHIRE_DIR . "/javascript/NumericField.js");
|
||||||
Requirements::javascript(SAPPHIRE_DIR . "/javascript/CalendarDateField.js");
|
Requirements::javascript(SAPPHIRE_DIR . "/javascript/CalendarDateField.js");
|
||||||
|
|
||||||
$field = DateField::Field();
|
$field = DateField::Field();
|
||||||
|
|||||||
@ -1,130 +0,0 @@
|
|||||||
|
|
||||||
|
|
||||||
// _DAYS_IN_MONTH = new Array( 31, 29, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31 );
|
|
||||||
|
|
||||||
NumericField = Class.create();
|
|
||||||
NumericField.applyTo('input.numeric');
|
|
||||||
NumericField.prototype = {
|
|
||||||
initialize: function() {
|
|
||||||
this.oldValue = this.value;
|
|
||||||
},
|
|
||||||
|
|
||||||
setRange: function( minValue, maxValue ) {
|
|
||||||
this.minValue = minValue;
|
|
||||||
this.maxValue = maxValue;
|
|
||||||
},
|
|
||||||
|
|
||||||
onkeyup: function() {
|
|
||||||
var testValue = this.value;
|
|
||||||
|
|
||||||
if( testValue == this.oldValue )
|
|
||||||
return;
|
|
||||||
|
|
||||||
var length = this.maxLength;
|
|
||||||
this.value = '';
|
|
||||||
|
|
||||||
var testedOk = true;
|
|
||||||
|
|
||||||
var regex = new RegExp( '^\\d{0,' + length + '}$' );
|
|
||||||
|
|
||||||
// check that the value is numeric
|
|
||||||
if( !testValue.match( regex ) )
|
|
||||||
testedOk = false;
|
|
||||||
|
|
||||||
if( testedOk && testValue.length > 0 ) {
|
|
||||||
|
|
||||||
// check that the number is not outside the range
|
|
||||||
if( testedOk && typeof this.minValue != 'undefined' && parseInt(testValue) < this.minValue )
|
|
||||||
testedOk = false;
|
|
||||||
|
|
||||||
if( testedOk && typeof this.maxValue != 'undefined' && parseInt(testValue) > this.maxValue )
|
|
||||||
testedOk = false;
|
|
||||||
|
|
||||||
// use any external tests
|
|
||||||
if( testedOk && typeof this.externalValidate != 'undefined' && !this.externalValidate( testValue ) )
|
|
||||||
testedOk = false;
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
if( testedOk ) {
|
|
||||||
this.oldValue = this.value = testValue;
|
|
||||||
|
|
||||||
// DEBUG This produces weird javascript-errors, and is not very useable at all
|
|
||||||
// DONT MERGE
|
|
||||||
/*
|
|
||||||
if( this.value.length == this.maxLength && this.nextField )
|
|
||||||
this.nextField.focus();
|
|
||||||
*/
|
|
||||||
|
|
||||||
if( this.callOnValidate )
|
|
||||||
this.callOnValidate();
|
|
||||||
} else
|
|
||||||
this.value = this.oldValue;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
DMYCalendarDateField = Class.create();
|
|
||||||
DMYCalendarDateField.applyTo('div.dmycalendardate');
|
|
||||||
DMYCalendarDateField.prototype = {
|
|
||||||
initialize: function() {
|
|
||||||
|
|
||||||
// the hidden field will contain the full date string to make it backwards compatible
|
|
||||||
// with the full date fields
|
|
||||||
this.hiddenDateField = this.getElementsByTagName('input')[0];
|
|
||||||
this.dayField = this.getElementsByTagName('input')[1];
|
|
||||||
this.monthField = this.getElementsByTagName('input')[2];
|
|
||||||
this.yearField = this.getElementsByTagName('input')[3];
|
|
||||||
|
|
||||||
this.hiddenDateField.onchange = this.updateVisibleDate.bind(this);
|
|
||||||
this.dayField.onchange = this.updateDate.bind(this);
|
|
||||||
this.monthField.onchange = this.updateDate.bind(this);
|
|
||||||
this.yearField.onchange = this.updateDate.bind(this);
|
|
||||||
|
|
||||||
// this field is updated and then validated before the hidden or visible
|
|
||||||
// fields are updated
|
|
||||||
|
|
||||||
this.oldDay = '';
|
|
||||||
this.oldMonth = '';
|
|
||||||
this.oldYear = '';
|
|
||||||
|
|
||||||
// these fields are numeric
|
|
||||||
// TODO, validate date range
|
|
||||||
|
|
||||||
this.dayField.callOnValidate = this.updateDate.bind(this);
|
|
||||||
this.monthField.callOnValidate = this.updateDate.bind(this);
|
|
||||||
this.yearField.callOnValidate = this.updateDate.bind(this);
|
|
||||||
|
|
||||||
this.dayField.setRange( 1, 31 );
|
|
||||||
// this.dayField.externalValidate = this.validateDay.bind(this);
|
|
||||||
|
|
||||||
this.monthField.setRange( 1, 12 );
|
|
||||||
|
|
||||||
this.dayField.nextField = this.monthField;
|
|
||||||
this.monthField.nextField = this.yearField;
|
|
||||||
|
|
||||||
this.dayField.oldlength = 0;
|
|
||||||
this.monthField.oldlength = 0;
|
|
||||||
this.yearField.oldlength = 0;
|
|
||||||
},
|
|
||||||
// C'mon it's a great name for a function
|
|
||||||
updateDate: function() {
|
|
||||||
this.hiddenDateField.value = this.dayField.value + '/' + this.monthField.value + '/' + this.yearField.value;
|
|
||||||
//alert(this.hiddenDateField.name);
|
|
||||||
},
|
|
||||||
updateVisibleDate: function() {
|
|
||||||
var matches = this.hiddenDateField.value.match( /(\d{2})\/(\d{2})\/(\d{4})/ );
|
|
||||||
this.dayField.value = matches[1];
|
|
||||||
this.monthField.value = matches[2];
|
|
||||||
this.yearField.value = matches[3];
|
|
||||||
},
|
|
||||||
validateDay: function( value ) {
|
|
||||||
/*if( this.monthField.value.length == 0 )
|
|
||||||
return true;
|
|
||||||
|
|
||||||
if( parseInt( value ) > _DAYS_IN_MONTH[parseInt( this.monthField.value )] )
|
|
||||||
return false;*/
|
|
||||||
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
60
javascript/NumericField.js
Normal file
60
javascript/NumericField.js
Normal file
@ -0,0 +1,60 @@
|
|||||||
|
NumericField = Class.create();
|
||||||
|
NumericField.applyTo('input.numeric');
|
||||||
|
NumericField.prototype = {
|
||||||
|
initialize: function() {
|
||||||
|
this.oldValue = this.value;
|
||||||
|
},
|
||||||
|
|
||||||
|
setRange: function( minValue, maxValue ) {
|
||||||
|
this.minValue = minValue;
|
||||||
|
this.maxValue = maxValue;
|
||||||
|
},
|
||||||
|
|
||||||
|
onkeyup: function() {
|
||||||
|
var testValue = this.value;
|
||||||
|
|
||||||
|
if( testValue == this.oldValue )
|
||||||
|
return;
|
||||||
|
|
||||||
|
var length = this.maxLength;
|
||||||
|
this.value = '';
|
||||||
|
|
||||||
|
var testedOk = true;
|
||||||
|
|
||||||
|
var regex = new RegExp( '^\\d{0,' + length + '}$' );
|
||||||
|
|
||||||
|
// check that the value is numeric
|
||||||
|
if( !testValue.match( regex ) )
|
||||||
|
testedOk = false;
|
||||||
|
|
||||||
|
if( testedOk && testValue.length > 0 ) {
|
||||||
|
|
||||||
|
// check that the number is not outside the range
|
||||||
|
if( testedOk && typeof this.minValue != 'undefined' && parseInt(testValue) < this.minValue )
|
||||||
|
testedOk = false;
|
||||||
|
|
||||||
|
if( testedOk && typeof this.maxValue != 'undefined' && parseInt(testValue) > this.maxValue )
|
||||||
|
testedOk = false;
|
||||||
|
|
||||||
|
// use any external tests
|
||||||
|
if( testedOk && typeof this.externalValidate != 'undefined' && !this.externalValidate( testValue ) )
|
||||||
|
testedOk = false;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
if( testedOk ) {
|
||||||
|
this.oldValue = this.value = testValue;
|
||||||
|
|
||||||
|
// DEBUG This produces weird javascript-errors, and is not very useable at all
|
||||||
|
// DONT MERGE
|
||||||
|
/*
|
||||||
|
if( this.value.length == this.maxLength && this.nextField )
|
||||||
|
this.nextField.focus();
|
||||||
|
*/
|
||||||
|
|
||||||
|
if( this.callOnValidate )
|
||||||
|
this.callOnValidate();
|
||||||
|
} else
|
||||||
|
this.value = this.oldValue;
|
||||||
|
}
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue
Block a user