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

<div>
<select id="city">
<option value="" selected>Chọn tỉnh thành</option>           
</select>
          
<select id="district">
<option value="" selected>Chọn quận huyện</option>
</select>

<select id="ward">
<option value="" selected>Chọn phường xã</option>
</select>
 </div>

var renderData = (array, select) => {
    let row = ' <option disable value="">Chọn</option>';
    array.forEach(element => {
        row += `<option data-id="${element.code}" value="${element.name}">${element.name}</option>`
    });
    document.querySelector("#" + select).innerHTML = row
}

$("#city").change(() => {
    callApiDistrict(host + "p/" + $("#city").find(':selected').data('id') + "?depth=2");
    printResult();
});
$("#district").change(() => {
    callApiWard(host + "d/" + $("#district").find(':selected').data('id') + "?depth=2");
    printResult();
});
$("#ward").change(() => {
    printResult();
})

var printResult = () => {
    if ($("#district").find(':selected').data('id') != "" && $("#city").find(':selected').data('id') != "" &&
        $("#ward").find(':selected').data('id') != "") {
        let result = $("#city option:selected").text() +
            " | " + $("#district option:selected").text() + " | " +
            $("#ward option:selected").text();
        $("#result").text(result)
    }

}
	</script>

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

Chia cột bằng thuộc tính display grid trong CSS

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

Code chuyển Html sang Markdow

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

Cách để tạo một Modal, Popup bằng HTML, CSS, JS cơ bản

Tạo hộp thời tiết bằng API openweathermap code Javascript

Đọc text trong hình ảnh

Code lịch hiển thị thời gian ngày tháng hiện tại bằng Javascript

Nhập vào input hiển thị số dạng rút ngắn theo đơn vị

Bộ lọc select chọn Tỉnh Thành, Quận huyện, Xã phường, sử dụng data-id