Select

TsgcHTMLComponent_Select — um dropdown de seleção Bootstrap 5 com optgroups, seleção múltipla, dimensionamento e vinculação a dataset, em Delphi, C++ Builder e .NET.

TsgcHTMLComponent_Select

Um dropdown que emite um form-select Bootstrap com label. Adicione opções (ou vincule um dataset), opcionalmente agrupe-as e permita seleção múltipla e então leia a propriedade HTML.

Classe do componente

TsgcHTMLComponent_Select

Renderiza

form-select do Bootstrap 5

Linguagens

Delphi, C++ Builder, .NET

Crie, adicione opções, renderize

Defina Name, Label_ e um Placeholder, adicione opções com AddOption (ou AddOptionGroup) e então leia HTML (ou insira-o em uma página TsgcHTMLTemplate_Bootstrap).

uses
  sgcHTML_Enums, sgcHTML_Component_Select;

var
  oSelect: TsgcHTMLComponent_Select;
begin
  oSelect := TsgcHTMLComponent_Select.Create(nil);
  try
    oSelect.Name := 'country';
    oSelect.Label_ := 'Country';
    oSelect.Placeholder := 'Select a country';
    oSelect.Size := ssLarge;

    oSelect.AddOption('es', 'Spain', True);
    oSelect.AddOption('fr', 'France');
    oSelect.AddOptionGroup('Americas', 'us', 'United States');

    WebModule.Response := oSelect.HTML;   // Bootstrap form-select
  finally
    oSelect.Free;
  end;
end;

// Or fill it straight from a dataset:
oSelect.LoadFromDataSet(qryCountries, 'Code', 'Name', 'Region');
// includes: sgcHTML_Enums.hpp, sgcHTML_Component_Select.hpp

TsgcHTMLComponent_Select *oSelect = new TsgcHTMLComponent_Select(NULL);
try
{
  oSelect->Name = "country";
  oSelect->Label_ = "Country";
  oSelect->Placeholder = "Select a country";
  oSelect->Size = ssLarge;

  oSelect->AddOption("es", "Spain", true);
  oSelect->AddOption("fr", "France");
  oSelect->AddOptionGroup("Americas", "us", "United States");

  String html = oSelect->HTML;   // Bootstrap form-select
}
__finally
{
  delete oSelect;
}
using esegece.sgcWebSockets;

var select = new TsgcHTMLComponent_Select();
select.Name = "country";
select.Label_ = "Country";
select.Placeholder = "Select a country";
select.Size = TsgcHTMLSelectSize.ssLarge;

select.AddOption("es", "Spain", true);
select.AddOption("fr", "France");
select.AddOptionGroup("Americas", "us", "United States");

string html = select.HTML;   // Bootstrap form-select

Principais propriedades & métodos

Os membros que você usa com mais frequência.

Opções

Options é uma coleção de TsgcHTMLSelectOption (cada uma com Value, Text, Selected, Disabled e Group); os métodos de conveniência AddOption(value, text, selected) e AddOptionGroup(group, value, text) a preenchem.

Identidade

Name define o nome do campo, Label_ a legenda, Placeholder uma opção inicial desativada e SelectID o id do elemento (padrão sel_<Name>).

Modo de seleção

Multiple o transforma em uma lista de seleção múltipla e VisibleItems define quantas linhas são exibidas de uma vez (o atributo size).

Dimensionamento

Size é um TsgcHTMLSelectSizessDefault, ssSmall ou ssLarge.

Vinculação a dataset

LoadFromDataSet(aDataSet, aValueField, aTextField, aGroupField) preenche as opções a partir de uma consulta, construindo <optgroup>s quando um campo de grupo é fornecido; atribua DataSource para atualização ao vivo.

Estado & saída

Required e Disabled marcam o controle; HTML retorna o <select> com label com todas as opções e optgroups.

Continue explorando

Todos os Componentes sgcHTMLExplore a matriz completa de recursos com mais de 60 componentes.
Baixar Versão de Avaliação GratuitaA avaliação de 30 dias inclui os projetos de demonstração 60.HTML.
PreçosLicenças Single, Team e Site com código-fonte completo.

Pronto para Começar?

Baixe a versão de avaliação gratuita e comece a construir UIs web em Delphi, C++ Builder e .NET.