MultiSelect
TsgcHTMLComponent_MultiSelect — Delphi、C++ Builder、.NET で、チップ、グループ化されたオプション、データセットバインディングを備えた検索可能なマルチセレクトドロップダウンをレンダリングします。
TsgcHTMLComponent_MultiSelect — Delphi、C++ Builder、.NET で、チップ、グループ化されたオプション、データセットバインディングを備えた検索可能なマルチセレクトドロップダウンをレンダリングします。
選択項目をチップとして保持するドロップダウンコントロールです。オプションを追加し（またはデータセットをバインドし）、任意でグループ化し、選択数の上限を設定してから、HTML プロパティを読み取ります。
TsgcHTMLComponent_MultiSelect
Bootstrap ドロップダウン + チップ（自己完結型ウィジェット）
Delphi, C++ Builder, .NET
Placeholder、FieldName、Size を設定し、AddOption でオプションを追加（または LoadFromDataSet でバインド）してから、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最もよく使うメンバーです。
Options は TsgcHTMLMultiSelectOption のコレクションです（各項目は Value、Text、Selected、Disabled、Group を持ちます）。
AddOption(aValue, aText, aSelected) は 1 件のエントリを追加します。グループ化されたエントリは同じ Group 値を共有し、ドロップダウンヘッダーの下にレンダリングされます。
LoadFromDataSet(aDataSet, aValueField, aTextField, aSelectedField) は、クエリから Options をクリアして再構築します。
ShowSearch（デフォルト True）は、ドロップダウン内にフィルターボックスを追加します。SearchPlaceholder と NoResultsText は、そのキャプションを上書きし、指定しない場合は使用中のロケールにフォールバックします。
MaxSelections は、一度に選択できるチップの数を制限します（0 は無制限を意味します）。Size（mssDefault、mssSmall、mssLarge）は、Bootstrap の form-select のサイズ指定に対応します。
FieldName は、選択されたオプションごとに 1 つの非表示 <input> をレンダリングし、フォームがすべての値を送信できるようにします。MultiSelectID は要素の id を設定します。