DatePicker
TsgcHTMLComponent_DatePicker — render a native HTML5 date, time or datetime input with optional min and max bounds, in Delphi, C++ Builder and .NET.
TsgcHTMLComponent_DatePicker — render a native HTML5 date, time or datetime input with optional min and max bounds, in Delphi, C++ Builder and .NET.
An input component that emits a Bootstrap form-control of HTML5 type date, time or datetime-local. Pick the Mode, set the bounds, then read the HTML property.
TsgcHTMLComponent_DatePicker
Native HTML5 date/time <input>
Delphi, C++ Builder, .NET
Choose Mode, set Name, Label_ and the MinDate/MaxDate bounds, then read HTML — or call the static Build helper for a one-liner.
uses
sgcHTML_Component_DatePicker;
var
oDate: TsgcHTMLComponent_DatePicker;
begin
oDate := TsgcHTMLComponent_DatePicker.Create(nil);
try
oDate.Mode := dmDate;
oDate.Name := 'booking';
oDate.Label_ := 'Booking date';
oDate.MinDate := '2026-01-01';
oDate.MaxDate := '2026-12-31';
oDate.Required := True;
WebModule.Response := oDate.HTML; // <input type="date">
finally
oDate.Free;
end;
end;
// Or the static one-liner (name, mode, label, value):
Result := TsgcHTMLComponent_DatePicker.Build('booking', dmDate, 'Booking date');// includes: sgcHTML_Component_DatePicker.hpp
TsgcHTMLComponent_DatePicker *oDate = new TsgcHTMLComponent_DatePicker(NULL);
try
{
oDate->Mode = dmDate;
oDate->Name = "booking";
oDate->Label_ = "Booking date";
oDate->MinDate = "2026-01-01";
oDate->MaxDate = "2026-12-31";
oDate->Required = true;
String html = oDate->HTML; // <input type="date">
}
__finally
{
delete oDate;
}
// Or the static one-liner:
String html = TsgcHTMLComponent_DatePicker::Build("booking", dmDate, "Booking date");using esegece.sgcWebSockets;
var date = new TsgcHTMLComponent_DatePicker();
date.Mode = TsgcHTMLDatePickerMode.dmDate;
date.Name = "booking";
date.Label_ = "Booking date";
date.MinDate = "2026-01-01";
date.MaxDate = "2026-12-31";
date.Required = true;
string html = date.HTML; // <input type="date">
// Or the static one-liner:
string html2 = TsgcHTMLComponent_DatePicker.Build("booking", TsgcHTMLDatePickerMode.dmDate, "Booking date");The members you reach for most often.
Mode (TsgcHTMLDatePickerMode) selects dmDate, dmTime or dmDateTime, emitting an HTML5 date, time or datetime-local input.
Name sets the input's name; Label_ renders a form-label; Value pre-fills the field; Placeholder shows hint text.
MinDate and MaxDate constrain the selectable range via the native min and max attributes; Required marks the field mandatory.
Build(name, mode, label, value) returns the markup in one line without managing an instance.
HTML returns the mb-3 wrapper with the label and the typed form-control; DatePickerID sets the element id.
Inherited Section, ColumnWidth and RowGroup place the field on a TsgcHTMLPageBuilder grid.
| Online HelpFull API reference and usage guide for this component. | Open | |
| All sgcHTML ComponentsBrowse the full feature matrix of 80+ components. | Open | |
| Download Free TrialThe 30-day trial ships the 60.HTML demo projects. | Open | |
| PricingSingle, Team and Site licenses with full source code. | Open |