DevExtreme Autocomplete Custom ItemTemplate

Question

Gibt es eine Möglichkeit, einer DevExtreme autocomplete Artikelvorlage eine Kopf- und Fußzeile hinzuzufügen?

Gerade jetzt bekomme ich meine Liste von meiner Datenquelle und füllt die Vorlage, aber das ist nur mit den Elementen, aber scheint nicht zu finden, eine Möglichkeit zum Hinzufügen einer Kopf- und Fußzeile.

das ist meine aktuelle Setup

@(Html.DevExtreme().Autocomplete() 
           .DataSource(ds => ds.WebApi().Controller("Search").LoadAction("SearchEmployees")) 
           .Placeholder("Search for employees") 
           .MinSearchLength(3) 
           .Height(66) 
           .OnItemClick("onItemClick") 
           .DisplayExpr("source.fullName") 
           .ItemTemplate(@<text> 
               <div class="media"> 
                <div class="pr-20"> 
                 <a class="avatar avatar-online"> 
                  <img class="img-circle img-sm" src="#someimage">" title="title"/> 
                 </a> 
                </div> 
                <div class="media-body"> 
                 <h5 class="mt-0 mb-5"> 
                  <%= source.fullName %> <small>(<%= source.employeeId %>)</small> 
                 </h5> 
                 <p> 
                  <small> Comapny : <%= source.companyName %></small><br/> 
                  <%for (i = 0; i < hightlights.length; i++) { %> 
                  <small> <%= hightlights[i].key %> : <%= hightlights[i].value %></small><br/> 
                  <%}%> 
                 </p> 
                </div> 
               </div> 
              </text>)) 

https://js.devexpress.com/Demos/WidgetsGallery/#demo/editorsautocompleteautocompleteautocomplete/

Answer 1

DevExtreme die automatische Vervollständigung nicht Kopf- und Fußzeilen direkt unterstützt. Am besten fügen Sie in Ihrer Datenquelle ein Anfangs- und Endelement hinzu. Fügen Sie eine Eigenschaft type auf Ihre Artikel:

[ { "type": "header", ... }, { "type": "data" ... }, { "type": "data" }, { "type": "Fußzeile" } ]

In Ihrer Artikel Vorlage Prüfung für die type-Eigenschaft entsprechend um das Element zu stylen.