MultiSelect Component — sgcHTML | eSeGeCe

MultiSelect

TsgcHTMLComponent_MultiSelect — renderizza un menu a tendina multi-select con ricerca, chip, opzioni raggruppate e binding a dataset, in Delphi, C++ Builder e .NET.

In sintesi

TsgcHTMLComponent_MultiSelect

Un controllo a tendina che mantiene le selezioni come chip. Aggiungi le opzioni (oppure collega un dataset), raggruppale facoltativamente e limita le selezioni, quindi leggi la proprietà HTML.

Classe del componente

TsgcHTMLComponent_MultiSelect

Renderizza

Bootstrap dropdown + chips (self-contained widget)

Famiglia

Moduli e Campi

Linguaggi

Delphi, C++ Builder, .NET

QuickStart

Aggiungi le opzioni, renderizzalo

Imposta Placeholder, FieldName e Size, aggiungi le opzioni con AddOption (oppure collega LoadFromDataSet), quindi leggi 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

Riferimento

Proprietà e metodi principali

I membri che utilizzerai più spesso.

Opzioni

Options è una collezione di TsgcHTMLMultiSelectOption (ciascuna con Value, Text, Selected, Disabled e Group).

Aggiungere opzioni

AddOption(aValue, aText, aSelected) aggiunge una singola voce; le voci raggruppate condividono lo stesso valore Group e vengono renderizzate sotto un’intestazione nel menu a tendina.

Binding ai dataset

LoadFromDataSet(aDataSet, aValueField, aTextField, aSelectedField) svuota e ripopola Options a partire da una query.

Ricerca

ShowSearch (predefinito True) aggiunge una casella di filtro all’interno del menu a tendina; SearchPlaceholder e NoResultsText sovrascrivono le relative etichette e ricadono sulla lingua attiva.

Limiti e dimensioni

MaxSelections limita quante chip possono essere selezionate contemporaneamente (0 significa illimitato); Size (mssDefault, mssSmall, mssLarge) corrisponde alle dimensioni form-select di Bootstrap.

Invio del valore

FieldName renderizza un <input> nascosto per ogni opzione selezionata, così il modulo invia tutti i valori; MultiSelectID imposta l’id dell’elemento.

Risorse

Continua a esplorare

	Guida in lineaRiferimento API completo e guida all’uso per questo componente.	Apri
	Tutti i componenti sgcHTMLEsplora la matrice completa delle funzionalità di oltre 80 componenti.	Apri
	Scarica la Prova GratuitaLa prova di 30 giorni include i progetti demo 60.HTML.	Apri
	PrezziLicenze Single, Team e Site con codice sorgente completo.	Apri