AutoComplete
TsgcHTMLComponent_AutoComplete — erzeugen Sie ein Texteingabefeld mit einer HTML5-<datalist> aus Vorschlägen, ganz ohne JavaScript, in Delphi, C++ Builder und .NET.
TsgcHTMLComponent_AutoComplete — erzeugen Sie ein Texteingabefeld mit einer HTML5-<datalist> aus Vorschlägen, ganz ohne JavaScript, in Delphi, C++ Builder und .NET.
Eine Eingabekomponente, die ein Bootstrap-form-control verknüpft mit einer nativen <datalist> ausgibt. Fügen Sie die Vorschlagszeichenketten zu Items hinzu und lesen Sie dann die HTML-Eigenschaft.
TsgcHTMLComponent_AutoComplete
Bootstrap-Input + HTML5-<datalist>
Delphi, C++ Builder, .NET
Setzen Sie Name und Label_, füllen Sie Vorschlagszeichenketten in Items und lesen Sie dann HTML (oder fügen Sie es in eine TsgcHTMLTemplate_Bootstrap-Seite ein).
uses
sgcHTML_Component_AutoComplete;
var
oAuto: TsgcHTMLComponent_AutoComplete;
begin
oAuto := TsgcHTMLComponent_AutoComplete.Create(nil);
try
oAuto.Name := 'country';
oAuto.Label_ := 'Country';
oAuto.Placeholder := 'Start typing...';
oAuto.MinLength := 2;
oAuto.Items.Add('Spain');
oAuto.Items.Add('France');
oAuto.Items.Add('Germany');
WebModule.Response := oAuto.HTML; // <input> + <datalist>
finally
oAuto.Free;
end;
end;// includes: sgcHTML_Component_AutoComplete.hpp
TsgcHTMLComponent_AutoComplete *oAuto = new TsgcHTMLComponent_AutoComplete(NULL);
try
{
oAuto->Name = "country";
oAuto->Label_ = "Country";
oAuto->Placeholder = "Start typing...";
oAuto->MinLength = 2;
oAuto->Items->Add("Spain");
oAuto->Items->Add("France");
oAuto->Items->Add("Germany");
String html = oAuto->HTML; // <input> + <datalist>
}
__finally
{
delete oAuto;
}using esegece.sgcWebSockets;
var auto = new TsgcHTMLComponent_AutoComplete();
auto.Name = "country";
auto.Label_ = "Country";
auto.Placeholder = "Start typing...";
auto.MinLength = 2;
auto.Items.Add("Spain");
auto.Items.Add("France");
auto.Items.Add("Germany");
string html = auto.HTML; // <input> + <datalist>Die Member, die Sie am häufigsten verwenden.
Name setzt das name-Attribut des Inputs; Label_ rendert ein form-label darüber; Value füllt das Feld vor.
Items (eine TStringList) enthält die Vorschlagszeichenketten, die zu <option>-Einträgen innerhalb der <datalist> werden.
Placeholder zeigt einen Hinweistext; MinLength legt fest, wie viele Zeichen eingegeben werden, bevor Vorschläge erscheinen (Standard 1).
AutoCompleteID setzt die Element-id, die das Input und seine verknüpfte <datalist> teilen; Standard ist sgcAutoComplete.
HTML gibt den mb-3-Wrapper zurück, der das Label, das form-control-Input und die gefüllte <datalist> enthält.
Die geerbten Section, ColumnWidth und RowGroup platzieren das Feld in einem TsgcHTMLPageBuilder-Raster.
| Alle sgcHTML-KomponentenDurchsuchen Sie die vollständige Funktionsmatrix von über 60 Komponenten. | Öffnen | |
| Kostenlose Testversion herunterladenDie 30-Tage-Testversion enthält die 60.HTML-Demoprojekte. | Öffnen | |
| PreiseSingle-, Team- und Site-Lizenzen mit vollständigem Quellcode. | Öffnen |