MultiSelect
TsgcHTMLComponent_MultiSelect — render a searchable multi-select dropdown with chips, grouped options and dataset binding, in Delphi, C++ Builder and .NET.
TsgcHTMLComponent_MultiSelect — render a searchable multi-select dropdown with chips, grouped options and dataset binding, in Delphi, C++ Builder and .NET.
A dropdown control that keeps its selections as chips. Add options (or bind a dataset), optionally group them and cap the selections, then read the HTML property.
TsgcHTMLComponent_MultiSelect
Bootstrap dropdown + chips (self-contained widget)
Delphi, C++ Builder, .NET
Set Placeholder, FieldName and Size, add options with AddOption (or bind LoadFromDataSet), then read HTML.
uses
sgcHTML_Component_MultiSelect;
var
oMulti: TsgcHTMLComponent_MultiSelect;
begin
oMulti := TsgcHTMLComponent_MultiSelect.Create(nil);
try
oMulti.FieldName := 'tags';
oMulti.Placeholder := 'Select tags';
oMulti.MaxSelections := 3;
oMulti.Size := mssLarge;
oMulti.AddOption('js', 'JavaScript', True);
oMulti.AddOption('py', 'Python');
oMulti.AddOption('pas', 'Pascal');
WebModule.Response := oMulti.HTML; // dropdown + chips + hidden inputs
finally
oMulti.Free;
end;
end;
// Or fill it straight from a dataset:
oMulti.LoadFromDataSet(qryTags, 'Code', 'Name', 'IsSelected');
// includes: sgcHTML_Component_MultiSelect.hpp
TsgcHTMLComponent_MultiSelect *oMulti = new TsgcHTMLComponent_MultiSelect(NULL);
try
{
oMulti->FieldName = "tags";
oMulti->Placeholder = "Select tags";
oMulti->MaxSelections = 3;
oMulti->Size = mssLarge;
oMulti->AddOption("js", "JavaScript", true);
oMulti->AddOption("py", "Python");
oMulti->AddOption("pas", "Pascal");
String html = oMulti->HTML; // dropdown + chips + hidden inputs
}
__finally
{
delete oMulti;
}
using esegece.sgcWebSockets;
var multi = new TsgcHTMLComponent_MultiSelect();
multi.FieldName = "tags";
multi.Placeholder = "Select tags";
multi.MaxSelections = 3;
multi.Size = TsgcHTMLMultiSelectSize.mssLarge;
multi.AddOption("js", "JavaScript", true);
multi.AddOption("py", "Python");
multi.AddOption("pas", "Pascal");
string html = multi.HTML; // dropdown + chips + hidden inputs
The members you reach for most often.
Options is a collection of TsgcHTMLMultiSelectOption (each with Value, Text, Selected, Disabled and Group).
AddOption(aValue, aText, aSelected) appends a single entry; grouped entries share the same Group value and render under a dropdown header.
LoadFromDataSet(aDataSet, aValueField, aTextField, aSelectedField) clears and refills Options from a query.
ShowSearch (default True) adds a filter box inside the dropdown; SearchPlaceholder and NoResultsText override its captions and fall back to the active locale.
MaxSelections caps how many chips can be picked at once (0 means unlimited); Size (mssDefault, mssSmall, mssLarge) matches Bootstrap's form-select sizing.
FieldName renders one hidden <input> per selected option so the form posts every value; MultiSelectID sets the element 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 |