function loadDoc() {
    var xhttp = new XMLHttpRequest();

    xhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
            document.getElementById("demo").innerHTML = this.responseText;
        }
    };

    xhttp.open("GET", "data.json", true);
    xhttp.send();
}

function submitForm() {
    var xhttp = new XMLHttpRequest();

    xhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
            document.getElementById("demo").innerHTML = this.responseText;
        }
    };

    xhttp.open("POST", "submit.php", true);
    // Bắt buộc khi gửi dữ liệu dạng form
    xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    xhttp.send("fname=Henry&lname=Ford");
}

$.get(URL, callback);

$(document).ready(function() {
    $("button").click(function() {
        $.get("data.asp", function(data, status) {
            if (status == "success") {
                $("#content").html(data);
            } else {
                $("#content").html("Failed");
            }
        });
    });
});

$.post(URL, data, callback);

$("button").click(function() {
    $.post("submit.asp",
        {
            name: "Donald Duck",
            city: "Duckburg"
        },
        function(data, status) {
            alert("Data: " + data + "\nStatus: " + status);
        }
    );
});

200 — OK                  Thành công
201 — Created             Tạo mới thành công (dùng cho POST)
204 — No Content          Thành công nhưng không có dữ liệu trả về (dùng cho DELETE)
304 — Not Modified        Client có thể dùng cache
400 — Bad Request         Request sai định dạng
401 — Unauthorized        Chưa đăng nhập / thiếu token
403 — Forbidden           Đã xác thực nhưng không có quyền
404 — Not Found           Resource không tồn tại
422 — Unprocessable Entity Dữ liệu không hợp lệ về mặt nghiệp vụ
500 — Internal Server Error Lỗi server không mong đợi

# Sai - dùng động từ
GET /getAllCars
POST /createNewCar
DELETE /deleteAllRedCars

# Đúng - dùng danh từ số nhiều
GET    /cars
POST   /cars
DELETE /cars

# Sai - dùng số ít
/car
/user
/product

# Đúng - dùng số nhiều
/cars
/users
/products

# Lấy tất cả xe của user 123
GET /users/123/cars

# Lấy xe số 5 của user 123 (2 cách đều được)
GET /users/123/cars/5
GET /cars/5

# Đúng - version ở đầu URL, dùng số nguyên
GET /v1/users/1
GET /v2/users/1

# Sai - số thập phân, hoặc version ở giữa
GET /users/v1.5/1

# Facebook style (trực quan nhất)
GET /posts?offset=50&limit=25

# Twitter style
GET /posts?page=3&rpp=25        # rpp = records per page

# LinkedIn style
GET /posts?start=50&count=25

# Global search - tìm trên toàn bộ hệ thống
GET /search?q=fluffy+fur

# Scoped search - tìm trong resource cụ thể
GET /users/123/cars?q=toyota

# Lọc theo field cụ thể với các toán tử
GET /cars?price[gte]=100&price[lte]=500&brand=toyota

# Chọn field trả về (giảm payload)
GET /users?fields=id,name,email

# Client thông báo gửi dữ liệu dạng JSON
Content-Type: application/json

# Client yêu cầu server trả về JSON
Accept: application/json

{
    "error": {
        "userMessage": "Rất tiếc, tài nguyên bạn yêu cầu không tồn tại.",
        "internalMessage": "No car found in the database with id=55",
        "code": 34
    }
}

$(document).ready(function() {

    // Load danh sách sản phẩm
    $("#loadmore").click(function() {
        $.get("/api/products", function(data, status) {
            for (var i = 0; i < data.length; i++) {
                $("#productlist").append(
                    "<tr>" +
                    "<td>" + data[i].Product_Code + "</td>" +
                    "<td>" + data[i].Product_Name + "</td>" +
                    "<td>" + data[i].Product_Summary + "</td>" +
                    "<td><img style='width:100px; height:auto;' src='" +
                        data[i].Product_Img_Url + "'></td>" +
                    "</tr>"
                );
            }
        });
    });

    // Tạo mới sản phẩm
    $("#createBtn").click(function() {
        var newProduct = {
            Product_Code: "SP001",
            Product_Name: "Laptop Example"
        };

        $.ajax({
            url: "/api/products",
            method: "POST",
            contentType: "application/json",
            data: JSON.stringify(newProduct),
            success: function(response) {
                console.log("Tạo thành công:", response);
            },
            error: function(xhr) {
                console.error("Lỗi:", xhr.status, xhr.responseText);
            }
        });
    });

});

// GET
fetch("/api/products")
    .then(response => {
        if (!response.ok) throw new Error("HTTP error: " + response.status);
        return response.json();
    })
    .then(data => {
        console.log(data);
    })
    .catch(error => console.error("Lỗi:", error));

// POST
fetch("/api/products", {
    method: "POST",
    headers: {
        "Content-Type": "application/json"
    },
    body: JSON.stringify({
        Product_Code: "SP001",
        Product_Name: "Laptop Example"
    })
})
.then(res => res.json())
.then(data => console.log("Tạo thành công:", data));

async function createProduct(product) {
    try {
        const response = await fetch("/api/products", {
            method: "POST",
            headers: { "Content-Type": "application/json" },
            body: JSON.stringify(product)
        });

        if (!response.ok) {
            throw new Error("Lỗi: " + response.status);
        }

        const data = await response.json();
        console.log("Thành công:", data);
    } catch (error) {
        console.error(error);
    }
}