Le code fourni utilise le mode MVVM pour charger efficacement l'état et les villes, mais il y a encore de la place à l'amélioration.
Simplifier la sélection de l'état et de la ville
reconstruire la fonction jQuery, utiliser la méthode pour supprimer le menu Urban Drop -Down, puis ajouter une nouvelle option. Considérez l'utilisation de
au lieu de comme première option pour permettre à [obligatoire] de vérifier. .empty()
val(null)
val(0)
Optimiser les appels ajax
var url = '@Url.Action("GetCities", "Home")'; var cities = $('#CityID'); $('#StateID').change(function() { $.getJSON(url, { id: $(this).val() }, function(response) { cities.empty().append($('<option>').val(null).text('请选择')); $.each(response, function(index, item) { cities.append($('<option>').val(item.Value).text(item.Text)); }); }); });
Afin d'éviter les appels AJAX redondants, un mécanisme de cache est réalisé pour stocker les données urbaines dans chaque état.
<替> Méthode alternative: Initialiser les données urbaines
var cache = {}; $('#StateID').change(function() { var selectedState = $(this).val(); if (cache[selectedState]) { // 从缓存中渲染选项 // ... 使用 cache[selectedState] 渲染城市下拉菜单 ... } else { $.getJSON(url, { id: selectedState }, function(response) { // 添加到缓存 cache[selectedState] = response; // ... 使用 response 渲染城市下拉菜单并添加到缓存 ... }); } });
dans le contrôleur:
dans la vue (script):
<提> Autres conseils
model.CityList = db.Cities.Select(d => new { City = d.CountryID, Text = d.CityName, Value = d.Id }).ToList();
// 将所有城市赋值给JavaScript数组 var allCities = JSON.parse('@Html.Raw(Json.Encode(Model.CityList))'); $('#StateID').change(function() { var selectedState = $(this).val(); var cities = $.grep(allCities, function(item, index) { return item.CountryID == selectedState; }); // 基于cities的值构建选项 // ... 使用 cities 数组渲染城市下拉菜单 ... });
Utilisez la méthode auxiliaire intégrée (@ url.action, @ html.raw) pour rendre le code concis et éviter le codage dur.
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!