Material Design Lite for Seaside
Version v2.4.0Fork me on GitHub            
AboutGetting startedComponentsWidgetsExtensions

Date Picker

A calendar in Material Design style to pick a date

Sat, May 10

 
SMTWTFS

Selected day: 10 May 2025
Date picker
	html
		render:
			(MDLDatePicker new
				callback: [ :day | selectedDay := day ];
				currentDate: selectedDay;
				onCompleteScript: ((html jQuery id: 'selectedDay2') load html: [ :r | 
					r text: 'Selected day: ' , selectedDay asString ]);
				yourself).
	html break.
	html div
		id: 'selectedDay2';
		mdlTypographyFontBold;
		mdlTextColorPrimary;
		with: 'Selected day: ' , selectedDay asString

Sat, May 10

 
SMTWTFS

Selected day: 10 May 2025
Flat date picker
	html div
		style: 'background-color: white;border: 1px grey solid;';
		with:
			(MDLFlatDatePicker new
				callback: [ :day | selectedDay := day ];
				currentDate: selectedDay;
				onCompleteScript: ((html jQuery id: 'selectedDay') load html: [ :r | 
					r text: 'Selected day: ' , selectedDay asString ]);
				yourself).
	html break.
	html div
		id: 'selectedDay';
		mdlTypographyFontBold;
		mdlTextColorPrimary;
		with: 'Selected day: ' , selectedDay asString