Q.

간단한 2단계 dropDown리스트는 어떻게 구현하나요?
A.

동적으로 가져오는 것이 아닌 정적으로 구성된 룩업트리예제는 아래와 같습니다.
주석 부분을 참고하시기 바랍니다.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>룩업샘플 2단계</title>

<script type="text/javascript" src="./scripts/jszip.min.js"></script>
<script type="text/javascript" src="./scripts/jquery-2.1.1.js"></script>
<script type="text/javascript" src="./scripts/realgridjs-lic.js"></script>
<script type="text/javascript" src="./scripts/realgridjs_eval.1.1.27.min.js"></script>
<script type="text/javascript" src="./scripts/realgridjs-api.1.1.27.js"></script>

<script type="text/javascript">

    var gridView;
    var dataProvider;

    window.onload = function () {
        RealGridJS.setRootContext("scripts");
        dataProvider = new RealGridJS.LocalDataProvider();
        gridView = new RealGridJS.GridView("realgrid");
        gridView.setDataSource(dataProvider);
        dataProvider.setOptions({ datetimeFormat: "yyyy/MM/dd" });

        setFields(dataProvider);
        setColumns(gridView);
        setLookups(gridView);

        //코드형태로 값이 넘어옴.
        rows = [
            ["O", "O1"],
            ["M", "M1"],
            ["O", "O2"],
            ["O", "O3"],
            ["M", "M2"],
            ["M", "M3"],
            ["O", "O3"]
        ];

        dataProvider.setRows(rows);

        gridView.onCellEdited = function (grid, itemIndex, dataRow, field) {
            var fieldName = dataProvider.getOrgFieldName(field);

            if (fieldName == "field1") {
                grid.setValue(itemIndex, "field2", "");
            };
        }
    };

    function setLookups(grid) {
        grid.setLookups([{
            id: "type1",
            levels: 2,
            //모든 경우의 수를 나열
            keys: [
                ["O", "O1"],
                ["O", "O2"],
                ["O", "O3"],
                ["M", "M1"],
                ["M", "M2"],
                ["M", "M3"],
            ],
            //경우의 수에 따른 표시값 설정
            values: [
                ["3분카레"],
                ["참치"],
                ["불고기피자"],
                ["우유"],
                ["바이오딸기"],
                ["상하치즈"]
            ]
        }]);
    }

    function setFields(provider) {
        var fields = [{
            fieldName: "field1"
        }, {
            fieldName: "field2"
        }];

        provider.setFields(fields);
    }

    function setColumns(grid) {
        var columns = [{
            name: "column1",
            fieldName: "field1",
            width: 150,
            header: {
                text: "제조사"
            },
            styles: {
                textAlignment: "center"
            },
            lookupDisplay: true,
            //1단계의 경우 바로 values, labels에 설정
            values: ["O","M"],
            labels: ["오뚜기","매일유업"],
            editor:{
              type: "dropDown"
            }
        }, {
            name: "column2",
            fieldName: "field2",
            width: 150,
            header: {
                text: "제품명"
            },
            styles: {
                textAlignment: "center"
            },
            editor:{
                type:"dropDown"
            },
            lookupDisplay: true,
            //위의 setLookups에서 설정한 id 지정
            lookupSourceId: "type1",
            lookupKeyFields: [
                "field1",
                "field2"
            ]
        }];

        grid.setColumns(columns);
    }


</script>
</head>
<body>
  <div id="realgrid" style="width:80%; height:505px;"></div>
</body>
</html>