Kendo UI Combobox friert beim Serverfiltern ein

Question

Ich bekomme rund 6000 Datensätze, die ich an Combobox binden muss. Ich mache Server-Filterung darauf, wenn Benutzer mindestens 2 Zeichen eingeben. Es funktioniert zum ersten Mal gut, aber wenn ich die Combobox lösche, friert meine Seite ein.

Unten ist, wie ich meine Combobox initiiert.

$("#myList").kendoComboBox({ 
     filter: "startswith", 
     dataTextField: "xName", 
     dataValueField: "xId", 
     template: '<span>#:xName# (#:gName#-#:gmName#)</span>', 
     dataSource: viewModel.get("mydataList"), 
     height: 400, 
     autoBind: false, 
     minLength: 2, 
    }).data("kendoComboBox"); 

Unten ist, wie ich die Datenquelle angegeben haben:

mydataList= new kendo.data.DataSource({ 
     transport: { 
      read: { 
       dataType: "json", 
      }, 
      parameterMap: function (options, operation) { 
       if (operation !== "read" && options.models) { 
        return { 
         models: kendo.stringify(options.models) 
        }; 
       } 
      } 
     }, 
     serverFiltering: true 
    } 
    ); 

Bitte auch vorschlagen, wenn ich den Dropdown-Pfeil verstecken.

Answer 1

Was Sie tun, ist nicht Server-Filterung. Nur weil Sie serverFiltering: true eingestellt haben, bedeutet das nicht, dass Sie Serverfilterung durchführen. Diese Einstellung dient nur dazu, der Datenquelle mitzuteilen, dass Sie die Serverfilterung verwenden, aber Sie müssen sie tatsächlich implementieren. Sie haben 6000 Datensätze, was eine Menge ist, und deshalb friert Ihre Combo-Box ein. Außerdem verwenden Sie asp.net MVC, und die Frage ist mit Kendo asp.net MVC markiert, so dass Sie die Razor-Syntax verwenden sollten. Hier ist, wie es geht.

Ihre ComboBox:

@(Html.Kendo().ComboBox() 
     .Name("myList") 
     .DataTextField("xName") 
     .DataValueField("xId") 
     .Template("<span>#:xName# (#:gName#-#:gmName#)</span>") 
     .Filter("startswith") 
     .AutoBind(false) 
     .Height(400) 
     .MinLength(2) 
     .DataSource(source => { 
      source.Read(read => 
      { 
       read.Action("GetMyList", "MyController"); 
      }) 
      .ServerFiltering(true); 
     }) 
) 

Dann in Ihrem Controller (MyConteroller in meinem Beispiel), werden Sie eine Aktion, die die gefilterte Liste zurückgibt:

public JsonResult GetMyList(string text) { 
    // Here you put the logic to filter the data you had in myDataList in your question 
}