Bộ lọc select chọn Tỉnh Thành, Quận huyện, Xã phường

<div>
<select class="form-select form-select-sm mb-3" id="city" aria-label=".form-select-sm">
<option value="" selected>Chọn tỉnh thành</option>           
</select>
          
<select class="form-select form-select-sm mb-3" id="district" aria-label=".form-select-sm">
<option value="" selected>Chọn quận huyện</option>
</select>

<select class="form-select form-select-sm" id="ward" aria-label=".form-select-sm">
<option value="" selected>Chọn phường xã</option>
</select>
 </div>

function renderCity(data) {
  for (const x of data) {
    citis.options[citis.options.length] = new Option(x.Name, x.Id);
  }
  citis.onchange = function () {
    district.length = 1;
    ward.length = 1;
    if(this.value != ""){
      const result = data.filter(n => n.Id === this.value);

for (const k of result[0].Districts) {
        district.options[district.options.length] = new Option(k.Name, k.Id);
      }
    }
  };
  district.onchange = function () {
    ward.length = 1;
    const dataCity = data.filter((n) => n.Id === citis.value);
    if (this.value != "") {
      const dataWards = dataCity[0].Districts.filter(n => n.Id === this.value)[0].Wards;

for (const w of dataWards) {
        wards.options[wards.options.length] = new Option(w.Name, w.Id);
      }
    }
  };
}
	</script>

Bộ lọc select chọn Tỉnh Thành, Quận huyện, Xã phường

Code jQuery thu gọn, mở rộng đoạn text

Bộ lọc select tỉnh thành, quận huyện sử dựng API provinces.open-api.vn

Tải về nội dung trong textarea bằng jQuery

Tự động cập nhật nội dung cho div khi nhập văn bản vào textarea

jQuery tạo hiệu ứng chữ tự động nhảy ra như đang nhập liệu

Hiệu ứng Animated Number Counter bằng jQuery