var fields = [
    {
        fieldName: "KorName",
        dataType: "text",
    },
    {
        fieldName: "Gender",
        dataType: "text",
    },
    {
        fieldName: "Age",
        dataType: "number",
    },
    {
        fieldName: "Phone",
        dataType: "text",
    },
];

var columns = [
    {
        name: "KorName",
        fieldName: "KorName",
        width: "60",
        header: {
            text: "이름",
        },
    },
    {
        name: "Gender",
        fieldName: "Gender",
        width: "40",
        header: {
            text: "성별",
        },
    },
    {
        name: "Age",
        fieldName: "Age",
        width: "40",
        header: {
            text: "나이",
        },
    },
    {
        name: "Phone",
        fieldName: "Phone",
        width: "100",
        header: {
            text: "전화번호",
        },
    },
];

const data = [
    {
        KorName: "박영호",
        Gender: "남",
        Age: "71",
        Phone: "(025)6563-2802",
    },
    {
        KorName: "조일형",
        Gender: "남",
        Age: "62",
        Phone: "(093)8809-8696",
    },
    {
        KorName: "김덕중",
        Gender: "여",
        Age: "53",
        Phone: "(064)5483-6874",
    },
    {
        KorName: "국영석",
        Gender: "남",
        Age: "63",
        Phone: "(044)7055-3032",
    },
];

document.addEventListener("DOMContentLoaded", function () {
    RealGrid.setLicenseKey(
        "upVcPE+wPOmtLjqyBIh9RkM/nBOseBrflwxYpzGZyYm9cY8amGDkiMnVeQKUHJDjW2y71jtk+wteqHQ1mRMIXzEcGIrzZpzzNTakk0yR9UcKS69Wn2kI83Uszabo3mU0LUipz0P8BheMHilNXwOhKViPkoEUbYPLyVfdcZjXXt8="
    );

    const provider = new RealGrid.LocalDataProvider();
    const gridView = new RealGrid.GridView("realgridContainer");
    gridView.setDataSource(provider);

    provider.setFields(fields);
    gridView.setColumns(columns);

    provider.setRows(data);
});