{"id":165,"date":"2014-03-25T23:23:50","date_gmt":"2014-03-25T14:23:50","guid":{"rendered":"http:\/\/www.fsquare.co.kr\/?p=165"},"modified":"2015-02-18T15:59:27","modified_gmt":"2015-02-18T06:59:27","slug":"extjs-server%ec%97%90%ec%84%9c-tree%ea%b5%ac%ec%a1%b0-%eb%8d%b0%ec%9d%b4%ed%84%b0%eb%a5%bc-json-%eb%8d%b0%ec%9d%b4%ed%84%b0%eb%a1%9c-%ec%a0%84%ec%86%a1","status":"publish","type":"post","link":"https:\/\/www.fsquare.co.kr\/?p=165","title":{"rendered":"ExtJs – Server\uc5d0\uc11c Tree\uad6c\uc870 \ub370\uc774\ud130\ub97c JSON \ub370\uc774\ud130\ub85c \uc804\uc1a1"},"content":{"rendered":"

ExtJs\uc758 Tree Panel\uad6c\uc870\ub97c \uc774\uc6a9\ud558\uc5ec \uba54\ub274\ub098 \uc120\ud0dd\ud56d\ubaa9\uc744 \uad6c\uc131\ud558\ub294 \uacbd\uc6b0 \ub370\uc774\ud130\ub97c Ajax \ub4f1\uc744 \ud1b5\ud574 Data Model\ub85c \ub0b4\ub824\ubc1b\uc544 Panel\uc5d0 \ubfcc\ub824\uc57c \ud55c\ub2e4(\uadf8\ub807\uc9c0 \uc54a\uc73c\uba74 Tree\ub97c \uac31\uc2e0\ud558\uae30\ub3c4 \uc5b4\ub824\uc6cc\uc9c0\uace0 \uacf5\ud1b5\ubaa8\ub4c8\uc744 \uc0ac\uc6a9\ud558\uae30 \uc5b4\ub824\uc6cc \uc9c4\ub2e4).
\n\uc774 \ub54c \uc11c\ubc84\ucabd\uc5d0\uc11c Tree\uad6c\uc870\uc758 json \ub370\uc774\ud130\ub97c \ub0b4\ub824\uc8fc\uae30 \uc704\ud574\uc11c\ub294 \uacb0\uad6d \uc11c\ubc84\ucabd\uc5d0\uc11c json\ub370\uc774\ud130\ub97c \ub9cc\ub4e4\uae30 \uc804 \uba3c\uc800 tree \uad6c\uc870\ub85c \ub370\uc774\ud130\ub97c \uc7ac\uc815\ub82c\ud574\uc11c json\ub370\uc774\ud130 \ud615\ud0dc\ub85c \uc804\ud658\ud574\uc57c \ud55c\ub2e4.<\/p>\n

\ub9ce\uc740 \uac80\uc0c9 \ub05d\uc5d0 \ucc3e\uc740 \ud301\uc740 \ub2e4\uc74c\uacfc \uac19\ub2e4.<\/p>\n

\ub370\uc774\ud130 \uc870\ud68c(php)<\/strong><\/p>\n

...\r\ndb\uc870\ud68c\r\n...\r\n    $data = array();\r\n    $i = 0;\r\n    while ( $row = dbnext($result) ) { \/\/ \ucffc\ub9ac \uacb0\uacfc\ub97c loop \ub3cc\uba74\uc11c \ubc30\uc5f4\uc5d0 \ucc44\uc6b0\ub294 \ubd80\ubd84\r\n          $data[$i] = array();\r\n          $data[$i]['id'] = $row[0];    \/\/ \uc815\ub82c\uc744 \uc704\ud55c \ud0a4\uac12\uc744 \uc77d\uc74c. \uc774\ub97c id\ub77c\uace0 \ud558\ub294 field\uc5d0 \uc800\uc7a5\r\n          $data[$i]['parent_id] = $row[4];  \/\/ \uc815\ub82c\uc744 \uc704\ud574 \ubd80\ubaa8(parent) \ud0a4\uac12\uc744 \uc77d\uc74c\r\n          $data[$i]['leaf'] = true;         \/\/ \ubaa8\ub4e0 \ub178\ub4dc\ub97c \uc7a0\uc815\uc801\uc73c\ub85c leaf\ub85c \uc800\uc7a5\r\n          for ( $idx = 1; $idx <= 3; $idx++ ) { \/\/ \uc870\ud68c\ud55c field\uac12\uc744 \ubc30\uc5f4\uc5d0 \uc785\ub825 \ubc1b\uc74c \r\n              $field_name = \"field\" . $idx;\r\n              $data[$i][$field_name] = $row[$idx];\r\n          }\r\n          $i++;\r\n    }\r\n...\r\ndb close<\/pre>\n
\uc815\ub82c\ud558\ub294 \ubd80\ubd84(php)<\/strong><\/p>\n
         $itemsByReference = array();\r\n         foreach($data as $key => &$item) {\r\n               $itemsByReference[$item['id']] = &apm;$item;\r\n         }\r\n\r\n         foreach($data as $key => &$item)\r\n               if($item['parent_id'] && isset($itemsByRefence[$item['parent_id']])) {\r\n                    $itemsByReference[$item['parent_id']['children'][] = &$item;\r\n                    $itemsByReference[$item[parent_id']['expanded'] = true;\r\n                    unset($itemsByReference[$item['parent_id']]['leaf']);\r\n               }\r\n\r\n         foreach($data as $key => &$item) {\r\n               if($item['parent_id'] && isset($itemsByReference[$item['parent_id']]))\r\n                    unset($data[$key]);\r\n         }\r\n\r\n         if ($i > 0) {\r\n             print json_encode($data);\r\n         }<\/pre>\n
php\uc5d0\uc11c \uc9c0\uc6d0\ud558\ub294 json\uacfc \ubc30\uc5f4\uc758 call by reference\uac00 jsp\uc5d0\uc11c\ub294 \uc9c0\uc6d0\ub418\uc9c0 \uc54a\ub294\ub2e4.
\n\uadf8\ub798\uc11c json\uc740 \ubcc4\ub3c4 class\ub97c \uc0ac\uc6a9\ud574\uc11c \ud574\uacb0\ud588\uace0(org.json.*), \ub370\uc774\ud130\uc758 \uc815\ub82c\uc740 stack \uad6c\uc870\ub97c \uc774\uc6a9\ud558\uc5ec\u00a0\uad6c\ud604\ud588\ub2e4.<\/p>\n
\ub370\uc774\ud130 \uc870\ud68c(jsp)<\/strong><\/p>\n
    JSONArray   jData = new JSONArray();\r\n    HashMap subData;\r\n...\r\n    \ub370\uc774\ud130 \uc870\ud68c\r\n...\r\n       i = 0;\r\n       while ( row.next() ) {\r\n            subData = new HashMap();\r\n            subData.put(\"id\", row.getString(2));         \/\/ \ud0a4\uac12\uc744 \uc785\ub825\ud55c\ub2e4.\r\n            if ( i == 0 ) thisTermAmount = Double.valueOf(row.getString(13));\r\n            for ( idx = 1;  idx <= 3; n++ ){\r\n                  subData.put(\"field\" + String.valueOf(idx), row.getString(idx));\r\n             }\r\n             subData.put(\"seq\", row.getString(4));    \/\/ seq\uc640 depth \ud544\ub4dc\uac00 \ud544\uc218\ub2e4\r\n             subData.put(\"depth\", row.getString(5));\r\n             subData.put(\"parent_id\", row.getString(6));\r\n             subData.put(\"leaf\", true);\r\n             jData.put(i, subData);\r\n             i++;\r\n        }\r\n     if ( i > 0 ) \r\n             out.println(Utils.TreeJson(jData).toString());<\/pre>\n
\ubc30\uc5f4\uc744 \uadf8\ub300\ub85c \uc774\uc6a9\ud558\uc5ec\uc11c\ub294 json\uc73c\ub85c \ubcc0\ud658\ud558\uae30 \ud798\ub4e4\uc5b4 JSONArray\uc640 HashMap()\uc744 \uc774\uc6a9\ud558\uc5ec \ub370\uc774\ud130\ub97c \uc800\uc7a5\ud558\uc5ec \uc774\ub97c \ub2e4\uc2dc \uc7ac\uc815\ub82c\ud558\ub294 \uad6c\uc870\ub85c \uc791\uc131\ud558\uc600\ub2e4.<\/p>\n
\uc815\ub82c\ud558\ub294 \ubd80\ubd84(jsp)<\/strong><\/p>\n
import java.util.*;\r\nimport org.json.*;\r\n\r\npublic class Utils {\r\n\r\n    Utils() {}\r\n\r\n    public static JSONArray TreeJson(JSONArray jData)\r\n    {\r\n        int     len, m;\r\n        Stack   s1 = new Stack();\r\n        Stack   s2 = new Stack();\r\n        JSONObject  j1, j2;\r\n\r\n        try {\r\n            j1 = jData.getJSONObject(0);\r\n            s1.push(j1);\r\n            for ( m = 1; m < jData.length(); m++) {\r\n                j2 = jData.getJSONObject(m);\r\n                if ( Integer.parseInt(j1.get(\"depth\").toString()) <= Integer.parseInt(j2.get(\"depth\").toString()) ) {\r\n                     s1.push(j2);\r\n                     j1 = j2;\r\n                 }\r\n                 else if ( Integer.parseInt(j1.get(\"depth\").toString()) > Integer.parseInt(j2.get(\"depth\").toString())  ) {\r\n                    while (  Integer.parseInt((s1.peek()).get(\"depth\").toString()) > Integer.parseInt(j2.get(\"depth\").toString()) ) {\r\n                        JSONArray children = new JSONArray();\r\n                        int     lvl = Integer.parseInt((s1.peek()).get(\"depth\").toString());\r\n                        while ( Integer.parseInt((s1.peek()).get(\"depth\").toString()) == lvl ) {\r\n                            s2.push(s1.pop());\r\n                        }\r\n                        while(s2.size() > 0 ) {\r\n                            children.put(s2.pop());\r\n                        }\r\n                        j1 = s1.pop();\r\n                        j1.put(\"children\", children);\r\n                        j1.remove(\"leaf\");\r\n                        j1.put(\"leaf\", false);\r\n                        s1.push(j1);\r\n                    }\r\n                    s1.push(j2);\r\n                    j1 = j2;\r\n                }\r\n            }\r\n\r\n            while ( s1.size() > 0 && Integer.parseInt((s1.peek()).get(\"depth\").toString()) > 1 ) {\/\/ clear stack\r\n                JSONArray children = new JSONArray();\r\n                int     lvl = Integer.parseInt((s1.peek()).get(\"depth\").toString());\r\n                while ( Integer.parseInt((s1.peek()).get(\"depth\").toString()) == lvl ) {\r\n                    s2.push(s1.pop());\r\n                }\r\n                while(s2.size() > 0 ) {\r\n                    children.put(s2.pop());\r\n                }\r\n                j1 = s1.pop();\r\n                j1.put(\"children\", children);\r\n                j1.remove(\"leaf\");\r\n                j1.put(\"leaf\", false);\r\n                s1.push(j1);\r\n            }\r\n        }\r\n        catch( JSONException je) {\r\n        }\r\n\r\n        return new JSONArray(s1);\r\n    }\r\n}<\/pre>\n
java expert\uac00 \uc544\ub2c8\ub77c \ucf54\ub4dc\uac00 \ube44\ud6a8\uc728\uc801\uc73c\ub85c \uad6c\uc131\ub418\uc5c8\uc744 \uc218 \uc788\uc73c\ub098 \uc77c\ub2e8 php\uc5d0 \uc5c6\ub294 json\ud568\uc218\uc640 tree \uc815\ub82c \ud568\uc218\ub97c \uad6c\ud604\ud588\ub2e4.<\/p>\n
\uc2e4\ud589 \uacb0\uacfc\ub294 tree \uad6c\uc870\uc758 \ub370\uc774\ud130\ub97c json \ud615\ud0dc\ub85c \ubcf4\ub0b4\uac8c \ub41c\ub2e4.<\/p>\n
\uc2e4\ud589 \uacb0\uacfc \uc608<\/strong><\/p>\n
{id:001,field0:root,parent_id:NULL,leaf:false,child:[{id:002,field0:'\ub178\ub4dc1',parent_id:001,leaf:true},{id:003,field0:'\ub178\ub4dc100',parent_id:001,leaf:true}]}<\/pre>\n
 <\/p>\n
 <\/p>\n
 <\/p>\n","protected":false},"excerpt":{"rendered":"
ExtJs\uc758 Tree Panel\uad6c\uc870\ub97c \uc774\uc6a9\ud558\uc5ec \uba54\ub274\ub098 \uc120\ud0dd\ud56d\ubaa9\uc744 \uad6c\uc131\ud558\ub294 \uacbd\uc6b0 \ub370\uc774\ud130\ub97c Ajax \ub4f1\uc744 \ud1b5\ud574 Data Model\ub85c \ub0b4\ub824\ubc1b\uc544 Panel\uc5d0 \ubfcc\ub824\uc57c \ud55c\ub2e4(\uadf8\ub807\uc9c0 \uc54a\uc73c\uba74 Tree\ub97c \uac31\uc2e0\ud558\uae30\ub3c4 \uc5b4\ub824\uc6cc\uc9c0\uace0 \uacf5\ud1b5\ubaa8\ub4c8\uc744 \uc0ac\uc6a9\ud558\uae30 \uc5b4\ub824\uc6cc \uc9c4\ub2e4). \uc774 \ub54c \uc11c\ubc84\ucabd\uc5d0\uc11c Tree\uad6c\uc870\uc758 json \ub370\uc774\ud130\ub97c \ub0b4\ub824\uc8fc\uae30 \uc704\ud574\uc11c\ub294 \uacb0\uad6d \uc11c\ubc84\ucabd\uc5d0\uc11c json\ub370\uc774\ud130\ub97c \ub9cc\ub4e4\uae30 \uc804 \uba3c\uc800 tree \uad6c\uc870\ub85c \ub370\uc774\ud130\ub97c \uc7ac\uc815\ub82c\ud574\uc11c json\ub370\uc774\ud130 \ud615\ud0dc\ub85c \uc804\ud658\ud574\uc57c \ud55c\ub2e4. \ub9ce\uc740 \uac80\uc0c9 \ub05d\uc5d0 \ucc3e\uc740 \ud301\uc740 \ub2e4\uc74c\uacfc \uac19\ub2e4. […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[8],"tags":[],"class_list":["post-165","post","type-post","status-publish","format-standard","hentry","category-extjs"],"_links":{"self":[{"href":"https:\/\/www.fsquare.co.kr\/index.php?rest_route=\/wp\/v2\/posts\/165","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.fsquare.co.kr\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.fsquare.co.kr\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.fsquare.co.kr\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.fsquare.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=165"}],"version-history":[{"count":2,"href":"https:\/\/www.fsquare.co.kr\/index.php?rest_route=\/wp\/v2\/posts\/165\/revisions"}],"predecessor-version":[{"id":173,"href":"https:\/\/www.fsquare.co.kr\/index.php?rest_route=\/wp\/v2\/posts\/165\/revisions\/173"}],"wp:attachment":[{"href":"https:\/\/www.fsquare.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=165"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.fsquare.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=165"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.fsquare.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=165"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}