Slider
TsgcHTMLComponent_Slider — render a Bootstrap range slider with a live value badge, optional min/max labels and color styling, in Delphi, C++ Builder and .NET.
TsgcHTMLComponent_Slider — render a Bootstrap range slider with a live value badge, optional min/max labels and color styling, in Delphi, C++ Builder and .NET.
A labelled Bootstrap form-range input. Set the Min/Max/Step bounds and a starting Value, pick a ColorStyle, then read the HTML property.
TsgcHTMLComponent_Slider
Bootstrap form-range + live value badge
Delphi, C++ Builder, .NET
Set Min, Max, Step and a starting Value, pick a ColorStyle, then read HTML.
uses
sgcHTML_Enums, sgcHTML_Component_Slider;
var
oSlider: TsgcHTMLComponent_Slider;
begin
oSlider := TsgcHTMLComponent_Slider.Create(nil);
try
oSlider.FieldName := 'volume';
oSlider.LabelText := 'Volume';
oSlider.Min := 0;
oSlider.Max := 100;
oSlider.Step := 5;
oSlider.Value := 50;
oSlider.ShowMinMax := True;
oSlider.ColorStyle := hcSuccess;
WebModule.Response := oSlider.HTML; // form-range + live value badge
finally
oSlider.Free;
end;
end;// includes: sgcHTML_Enums.hpp, sgcHTML_Component_Slider.hpp
TsgcHTMLComponent_Slider *oSlider = new TsgcHTMLComponent_Slider(NULL);
try
{
oSlider->FieldName = "volume";
oSlider->LabelText = "Volume";
oSlider->Min = 0;
oSlider->Max = 100;
oSlider->Step = 5;
oSlider->Value = 50;
oSlider->ShowMinMax = true;
oSlider->ColorStyle = hcSuccess;
String html = oSlider->HTML; // form-range + live value badge
}
__finally
{
delete oSlider;
}using esegece.sgcWebSockets;
var slider = new TsgcHTMLComponent_Slider();
slider.FieldName = "volume";
slider.LabelText = "Volume";
slider.Min = 0;
slider.Max = 100;
slider.Step = 5;
slider.Value = 50;
slider.ShowMinMax = true;
slider.ColorStyle = TsgcHTMLColor.hcSuccess;
string html = slider.HTML; // form-range + live value badgeThe members you reach for most often.
Min (default 0), Max (default 100) and Step (default 1) bound the <input type="range">.
Value sets the starting position; ShowValue (default True) renders a live badge that updates via an inline oninput handler as the user drags.
LabelText renders a form-label above the slider; ShowMinMax (default False) prints the Min/Max bounds under the track.
Color accepts a raw hex string; when empty, ColorStyle (TsgcHTMLColor, default hcPrimary) supplies the accent color for both the track and the value badge.
FieldName sets the name attribute so the value posts with the form; Disabled removes it from the submission set.
SliderID sets the element id (falls back to sld_<FieldName> or an auto-generated id).
| 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 |