asp.net dropdownlist mise en cache pour les données énormes

Vous pouvez y parvenir en utilisant le service Web.

Tout d’abord, ajoutez le code suivant dans votre page aspx.

Maintenant, créez votre service Web en utilisant le code suivant.

 using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.Services; using System.Data.SqlClient; [System.Web.Script.Services.ScriptService] public class WebService : System.Web.Services.>WebService { [WebMethod] public List ShowCountryList(ssortingng sLookUP) { List lstCounsortinges = new List(); ssortingng sConnSsortingng = "Data Source=DNA;Persist Security Info=False;" + "Initial Catalog=DNA_CLASSIFIED;User Id=sa;Password=;Connect Timeout=30;"; SqlConnection myConn = new SqlConnection(sConnSsortingng); SqlCommand objComm = new SqlCommand("SELECT CountryName FROM Country " + "WHERE CountryName LIKE '%'+@LookUP+'%' ORDER BY CountryName", myConn); myConn.Open(); objComm.Parameters.AddWithValue("@LookUP", sLookUP); SqlDataReader reader = objComm.ExecuteReader(); while (reader.Read()) { lstCounsortinges.Add(reader["CountryName"].ToSsortingng()); } myConn.Close(); return lstCounsortinges; } } 

Enfin, Create jquery Method pour lier Textbox avec webservice,

Je vous recommande de tirer parti du plugin autocomplete de jQuery:

https://jqueryui.com/autocomplete/

Il est configurable et propose une recherche automatique complète. Il peut également utiliser votre source de données distante (bien que vous puissiez envisager une réponse d’API paginée):

http://api.jqueryui.com/autocomplete/#option-source

Dans le backend, créez une controller action (si vous utilisez ASP.NET MVC) ou une page method (si vous utilisez ASP.NET Web Forms) qui reçoit un paramètre searchTerm et retourne un tableau du haut (par exemple, 100 ) résultats.

Dans le frontend, utilisez un plugin typeahead / autocomplete tel que celui-ci . Lorsque l’utilisateur définit le terme de recherche, effectuez une requête Ajax sur le backend et affichez les résultats. Lors de l’exécution de la demande Ajax , vous pouvez également activer et configurer la mise en cache. Aucune optimisation supplémentaire ne sera nécessaire.

Utilisez la zone de saisie semi-automatique et définissez la source de données à partir d’une API distante, en particulier lorsque vous travaillez avec un dataset volumineux. Cela évitera que l’interface utilisateur de votre application ne soit pendue à chaque recherche de personnage.

Référez-vous au lien: https://github.com/ghiden/angucomplete-alt

dépend de la provenance des éléments de la liste. s’ils viennent d’une liste ou d’une firebase database, ajoutez-les, puis utilisez JavaScript pour effectuer une recherche dans la liste.

         
 
  
 
    public class Department { public int Id { get; set; } public ssortingng Name { get; set; } } private static List GetDepartment() { List departments = new List(); for (int i = 0; i < 10000; i++) { Department department = new Department(); department.Id = i; department.Name = "Department " + i.ToString(); departments.Add(department); } return departments; } [WebMethod] public static List GetDepartment(ssortingng departmentName) { int totalDepartments = GetDepartment().Count; List departments = GetDepartment().Where(d => d.Name.ToLower().StartsWith(departmentName.ToLower())).Take(20).ToList(); return departments; } 

J’ai eu le même problème que toi et j’ai utilisé RadAutoCompleteBox . Il comporte de nombreux événements côté client et côté serveur qui vous aident à gérer diverses situations. C’est très confortable pour les projets ASP.NET.

Je vois deux solution immédiate pour cela.

1. Comme d’autres nous ont suggéré d’utiliser ajax pour rechercher un élément lié en tant que type d’utilisateur et pour l’afficher.
2. Lors du chargement de la page, récupérez toutes vos données et stockez-les dans une variable javascript. Vous pouvez ensuite effectuer une recherche sur cette variable en tant que type d’utilisateur et lier le résultat de la recherche à la liste déroulante.

Similaire à celui-ci :

En définitive, toute implémentation Autocomplete fonctionnera dans votre scénario.

Solution 1: Utiliser la case à cocher Autocomplete

• Si vous ne voulez pas gaspiller de la bande passante ou prendre en charge des périphériques avec une spécification faible, vous devez opter pour la saisie semi-automatique avec récupération des données côté serveur.
• Si vous voulez une grande facilité d’utilisation et que vous ne vous souciez pas de la bande passante, vous pouvez utiliser la saisie semi-automatique avec des données locales (extraire une fois les enregistrements 50k et les associer à la saisie semi-automatique). Mais assurez-vous que vous ne peignez pas tout cela dans DOM en même temps. Vous devez limiter les enregistrements affichés à un moment donné.

Solution 2 : utilisez select avec virtualisation

• Mais si vous voulez donner le meilleur de la convivialité à vos clients , vous devez choisir une solution dans laquelle votre zone de sélection est virtualisée et les données chargées dans DOM lors du défilement de la zone de sélection. Grâce à la virtualisation, vous vous assurez que seuls les éléments en cours d’affichage sur l’écran sont transférés à DOM .

  Vous pouvez trouver une sélection virtuelle basée sur jQuery ici

  Une implémentation similaire dans React here