MultiSelect-component — sgcHTML | eSeGeCe

MultiSelect

TsgcHTMLComponent_MultiSelect — render een doorzoekbare multi-select-dropdown met chips, gegroepeerde opties en datasetbinding, in Delphi, C++ Builder en .NET.

In één oogopslag

TsgcHTMLComponent_MultiSelect

Een dropdown-besturing die de selecties als chips bijhoudt. Voeg opties toe (of koppel een dataset), groepeer ze optioneel en begrens het aantal selecties, en lees dan de HTML-eigenschap.

Componentklasse

TsgcHTMLComponent_MultiSelect

Rendert

Bootstrap-dropdown + chips (zelfstandig widget)

Familie

Formulieren en invoer

Talen

Delphi, C++ Builder, .NET

QuickStart

Voeg opties toe, render het

Stel Placeholder, FieldName en Size in, voeg opties toe met AddOption (of koppel LoadFromDataSet), en lees dan 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

Referentie

Belangrijkste eigenschappen en methoden

De members die je het vaakst gebruikt.

Opties

Options is een verzameling van TsgcHTMLMultiSelectOption (elk met Value, Text, Selected, Disabled en Group).

Opties toevoegen

AddOption(aValue, aText, aSelected) voegt één item toe; gegroepeerde items delen dezelfde Group-waarde en worden gerenderd onder een dropdown-kop.

Datasetbinding

LoadFromDataSet(aDataSet, aValueField, aTextField, aSelectedField) wist Options en vult het opnieuw vanuit een query.

Zoeken

ShowSearch (standaard True) voegt een filterveld toe in de dropdown; SearchPlaceholder en NoResultsText overschrijven de teksten en vallen anders terug op de actieve taal.

Limieten en grootte

MaxSelections begrenst hoeveel chips tegelijk gekozen kunnen worden (0 betekent onbeperkt); Size (mssDefault, mssSmall, mssLarge) sluit aan bij de grootte-opties van Bootstrap's form-select.

Waarde posten

FieldName rendert per geselecteerde optie een verborgen <input>, zodat het formulier elke waarde post; MultiSelectID stelt het element-id in.

Bronnen

Blijf ontdekken

	Online helpVolledige API-referentie en gebruikshandleiding voor dit onderdeel.	Open
	Alle sgcHTML-componentenBlader door de volledige functiematrix van 80+ componenten.	Openen
	Download gratis proefversieDe proefversie van 30 dagen bevat de 60.HTML-demoprojecten.	Openen
	PrijzenSingle-, Team- en Site-licenties met volledige broncode.	Openen