updates

src/core/Render.js

@@ -728,13 +728,7 @@ export class Render {
 		new TwoDatePicker(input, {
 			style: field.style || 'normal',
 			disabled: field.disabled || false,
-			multiple: field.multiple || false,
-			setTime: field['set-time'] || false,
 			locales: field.locales || 'ro-RO',
-			dateFormat  : field['date-format'] || 'dd-mm-yyyy',
-			valueFormat : field['value-format'] || 'dd-mm-yyyy',
-			datesSep    : field['dates-sep'] || ' / ',
-			valuesSep   : field['values-sep'] || '&'
 		});
 
 		return input;

src/core/Rt.js

@@ -148,7 +148,7 @@ export class Rt {
 
 		if (Rt.csrfToken) {
 			headers = { 'X-CSRF-TOKEN': Rt.csrfToken }
-		}			
+		}		
 
 		return async(reqOpts) => {
 

src/utils/form-validator/FormValidator.js

@@ -29,7 +29,7 @@ export class FormValidator extends Validator {
 			reset_form : false
 		}, ... opts };
 
-		Ut.trigger(this.opts.onInit, this.target.elements);
+		Ut.trigger(this.opts.onInit, this.target.elements, this);
 
 		this.setEvents();
 	}

src/widgets/popup/Popup.js

@@ -160,10 +160,7 @@ export class Popup {
 	resize() {
 
 		if (this.opts.scrollBar) {
-			this.card.container.dxCss('max-height',
-				( window.innerHeight - (this.card?.toolbar?.clientHeight || 0) - this.opts.marginTop - this.opts.marginBottom )
-				+ 'px'
-			);
+			this.card.container.style.maxHeight = ( window.innerHeight - (this.card?.toolbar?.clientHeight || 0) - this.opts.marginTop - this.opts.marginBottom ) + 'px';
 		}
 
 		Ut.trigger(this.opts.onResize,
@@ -178,6 +175,8 @@ export class Popup {
 	*/
 	setEvents() {
 
+		const that = this;
+
 		if (this.opts.scrollBar) {
 
 			let tm = null;
@@ -189,7 +188,7 @@ export class Popup {
 					tm = null;
 				}
 
-				tm = setTimeout(_ => t.resize(), 300);
+				tm = setTimeout(_ => that.resize(), 300);
 			});
 		}
 

src/widgets/two-datepicker/TwoDatepicker.js

@@ -29,7 +29,7 @@ export class TwoDatePicker {
 			anim        : true,
 			locales     : 'ro-RO',
 			cancelable  : true,
-			hiddenMode  : false
+			hiddenMode  : false,
 		}, ... opts };
 
 		this.events = events || {};
@@ -69,7 +69,7 @@ export class TwoDatePicker {
 		this.ui.append(firstCol);
 		this.ui.append(secondCol);
 
-		let dpOpts = {
+		const dpOpts = {
 			style       : this.opts.style,
 			disabled    : this.opts.disabled,
 			fullMonth   : this.opts.fullMonth,
@@ -81,12 +81,12 @@ export class TwoDatePicker {
 
 		new DatePicker(firstCol, dpOpts, {
 			init: datepicker => that.datepicker[0] = datepicker,
-			onSelect: (_, date) => Ut.trigger(that.events.onChange, that, date, 0)
+			onSelect: (_, val) => this.selectDate(0, val)
 		});
 
 		new DatePicker(secondCol, dpOpts, {
 			init: datepicker => that.datepicker[1] = datepicker,
-			onSelect: (_, date) => Ut.trigger(that.events.onChange, that, date, 1)
+			onSelect: (_, val) => this.selectDate(1, val)
 		});
 
 		if (this.isInput) {
@@ -111,9 +111,62 @@ export class TwoDatePicker {
 			this.target.append(this.ui);
 		}
 
-	   Ut.trigger(this.events.init, this);
+	   Ut.trigger(this.opts.onInit, this);
 	}
 
+	/**
+	* TwoDatePicker, Select Value
+	*/
+	selectDate(index, val) {
+
+		Ut.trigger(this.opts.onSelect, this, index, val);
+
+		const firstDp  = this.datepicker[0];
+		const secondDp = this.datepicker[1];
+	
+		if (index == 0) {
+
+			secondDp.clear();
+			secondDp.minDate = firstDp.selectedDate;
+	
+			if (firstDp.month != secondDp.month) {
+
+				secondDp.year = firstDp.year;
+				secondDp.month = firstDp.month;
+	
+				secondDp.makeUI();
+			}
+			else {
+				secondDp.setDateRange({ minDate: firstDp.selectedDate });
+			}
+		
+			return;
+		}
+
+		if (!firstDp.selectedDate) {
+			this.target.value = '';
+			return;
+		}
+
+		this.target.value = `${this.dateFormat(firstDp.selectedDate)} - ${this.dateFormat(secondDp.selectedDate)}`;
+		this.hide();
+
+		Ut.trigger(this.opts.onChange, this);
+		this.target.dxTrigger('changed');
+	}
+
+	/**
+    * TwoDatepicker, Date Format
+    */
+    dateFormat(date) {
+        return date.toLocaleDateString(this.opts.locales, {
+            day   : '2-digit',
+            month : '2-digit',
+            year  : 'numeric'
+        });
+        //.replace(/\./g, '/');
+    };
+
 	/**
 	* TwoDatePicker, Show UI
 	*/
@@ -129,7 +182,7 @@ export class TwoDatePicker {
 
 		this.isOpen = true;
 
-		Ut.trigger(this.events.onShow, this);
+		Ut.trigger(this.opts.onShow, this);
 	}
 
 	/**
@@ -147,7 +200,7 @@ export class TwoDatePicker {
 
 			this.isOpen = false;
 
-			Ut.trigger(this.events.onHide, this);
+			Ut.trigger(this.opts.onHide, this);
 		}
 	}
 
@@ -243,7 +296,7 @@ export class TwoDatePicker {
 
 				this.target.dxOn('clear', _ => {
 					that.clear();
-					Ut.trigger(that.events.onChange, that, null, false);
+					Ut.trigger(that.opts.onChange, that, null, false);
 				});
 			}
 			
@@ -255,7 +308,7 @@ export class TwoDatePicker {
 
 			// Resize window Handler
 
-			window.dxOn('resize.two_datepicker' + this.ekey + ' orientationchange.two_datepicker' + this.ekey, _ => {
+			window.dxOn('scroll.two_datepicker resize.two_datepicker' + this.ekey + ' orientationchange.two_datepicker' + this.ekey, _ => {
 
 				if (tm) {
 					clearTimeout(tm);
@@ -282,11 +335,13 @@ export class TwoDatePicker {
 			this.target.dxOff('click.two_datepicker keydown.two_datepicker paste.two_datepicker restore.two_datepicker');
 
 			document.body.dxOff('click.two_datepicker' + this.ekey);
-			window.dxOff('resize.two_datepicker' + this.ekey + ' orientationchange.two_datepicker' + this.ekey);
+			window.dxOff('scroll.two_datepicker resize.two_datepicker' + this.ekey + ' orientationchange.two_datepicker' + this.ekey);
 		}
 
 		this.target.dxRemoveData('two_datepicker');
 
 		Stack.delete(this);
+
+		Ut.trigger(this.opts.onDestroy, this);
 	}
 }