{"id":115,"date":"2014-02-20T15:18:32","date_gmt":"2014-02-20T06:18:32","guid":{"rendered":"http:\/\/www.fsquare.co.kr\/?p=115"},"modified":"2015-02-18T15:59:27","modified_gmt":"2015-02-18T06:59:27","slug":"extjs-%ed%95%98%eb%93%9c%ec%bd%94%eb%94%a9%ec%9c%bc%eb%a1%9c-%ec%97%b0%ec%8a%b5%ed%95%98%ea%b8%b0-1","status":"publish","type":"post","link":"https:\/\/www.fsquare.co.kr\/?p=115","title":{"rendered":"ExtJs \ud558\ub4dc\ucf54\ub529\uc73c\ub85c \uc5f0\uc2b5\ud558\uae30 – 1"},"content":{"rendered":"

Extjs\ub97c \uc124\uce58\ud588\ub2e4\uba74 \uc774\uc81c sample\ub4f1\uc744 \uc798 \ud65c\uc6a9\ud558\uc5ec \uc0ac\uc6a9\ud558\uae30\ub9cc \ud558\uba74 \ub41c\ub2e4.
\nExtJs\ub97c \uc0ac\uc6a9\ud558\uae30 \uc704\ud574\uc11c\ub294 ExtJs\uc758 \uae30\ubcf8 \uad6c\uc870\ub97c \uc798 \uc774\ud574\ud574\uc57c \ud55c\ub2e4.
\nExtJs\ub294 Client Side Script\uc778 javascript\ub85c \uc774\ub8e8\uc5b4\uc9c4 Web \uac1c\ubc1c library\uc774\ub2e4. \uc774 library\uac00 \uacf5\ud1b5\uc73c\ub85c \ud654\uba74\uc5d0 \ub85c\ub529\ub418\uace0 \uadf8 \uc0c1\ud0dc\uc5d0\uc11c \uc0ac\uc6a9\uc790\uac00 \uc791\uc131\ud55c \ud654\uba74 script\uac00 \uc2e4\ud589\ub418\ub294 \ud615\uc2dd\uc774\ub2e4. Sencha\uc5d0\uc11c \uc81c\uc548\ud558\ub294 \ub610 \ub2e4\ub978 \ubc29\ubc95\uc740 extjs\ub97c \ud65c\uc6a9\ud558\uc5ec \ud654\uba74 \uad6c\uc131\uc5d0 \ud544\uc694\ud55c \uc0c8\ub85c\uc6b4 library\ub97c \uc0dd\uc131\ud558\uc5ec \uc774\ub97c \ubc30\ud3ec\ud558\ub294 \ubc29\uc2dd\uc774\ub2e4. script\ud504\ub85c\uadf8\ub7a8\uc758 \ud2b9\uc131\uc0c1 \ud654\uba74\uc758 \ub85c\ub529 \uc18d\ub3c4\uac00 \ube68\ub77c\uc57c \ud558\uace0 \ud654\uba74\uc5d0 \ud45c\uc2dc\ub418\ub294 \ubd80\ubd84(View)\uc640 \ub370\uc774\ud130\ub97c \ucc98\ub9ac\ud558\ub294 \ubd80\ubd84(Model)\uc744 \ubd84\ub9ac\ud558\uc5ec \ucf54\ub4dc\uc758 \uc7ac\uac00\uc6a9\uc131\ub3c4 \ub192\uc77c\uc218 \uc788\ub294 \ubc29\ubc95\uc774\ub2e4(MVC Model).
\n\uadf8\ub7ec\ub098 \uc18c\uaddc\ubaa8\uc758 \uac1c\ubc1c\uc5d0\uc11c\ub294 \uc624\ud788\ub824 \uc0ac\uc6a9\uc774 \uc5b4\ub835\uace0 \ucf54\ub4dc\uc758 \uc7ac\uac00\uc6a9\uc131\uc5d0 \ub300\ud55c \uc694\uad6c\uac00 \ub192\uc9c0 \uc54a\uc740 \uacbd\uc6b0 \ubd88\ud544\uc694\ud55c \uc791\uc5c5\uae4c\uc9c0 \ud3ec\ud568\ub420 \uc218 \uc788\uace0, \uc18c\uc2a4\uac00 \uc9e7\uc740 \uacbd\uc6b0 \ub85c\ub529\uc18d\ub3c4\uac00(script\uc5b8\uc5b4\uc758 \ud2b9\uc131\uc0c1 \uac1c\ubc1c\uc2dc \ud3ec\ud568\ub41c space\uc640 tab \ubb38\uc790\ub4e4\uc774 \ubaa8\ub450 \uc18c\uc2a4\uc5d0 \ud3ec\ud568\ub418\uc5b4 \uc788\uc5b4 \ud30c\uc77c \ud06c\uae30\uac00 \ucee4\uc9c4\ub2e4) \ud06c\uac8c \ucc28\uc774\ub098\uc9c0 \uc54a\uae30 \ub54c\ubb38\uc5d0 \uac04\ub2e8\ud788 script-engine + script \ubc29\uc2dd\uc73c\ub85c \uad6c\uc131\ud574\ub3c4 \ucda9\ubd84\ud55c \uac83 \uac19\ub2e4.
\n\uc0ac\uc2e4 \ub300\ubd80\ubd84\uc758 web browser\ub294 javascript(\ub610\ub294 vbscript)\ub97c \ubd84\uc11d(compile)\ud558\uace0 \uc2e4\ud589\ud558\uae30 \uc704\ud55c \uc5d4\uc9c4(gecko\uc640 \uac19\uc740 \ub808\uc774\uc544\uc6c3 \uc5d4\uc9c4\ub0b4\uc5d0)\uc744 \ud0d1\uc7ac\ud558\uace0 \uc788\ub2e4. \uc5ec\uae30\uc5d0 \ub0ae\uc740 \ub808\ubca8\uc758 javascript\uc640 style-sheet\ub97c \uacb0\ud569\ud558\uc5ec \ub9e4\ud06c\ub85c\ucc98\ub7fc \ud654\uba74 \uad6c\uc131\uc6a9 \ud568\uc218\ub4e4\uc744 \ub9cc\ub4e4\uc5b4 \ub193\uc740 library\uac00 ExtJs\uc774\ubbc0\ub85c \uc774\ub97c \uadf8\ub0e5 \uac00\uc838\ub2e4\uac00 \uc27d\uac8c \uc0ac\uc6a9\ud558\uae30\ub9cc \ud558\uba74 \ub418\ub2c8, \ubcf5\uc7a1\ud558\uac8c \uc0c8\ub85c\uc6b4 \uac1c\ubc1c\uc774\ub098 \ub300\ub2e8\uc704 \ud504\ub85c\uc81d\ud2b8\ub294 \uc0dd\uac01\ud558\uc9c0 \uc54a\uae30\ub85c \ud588\ub2e4.
\n\ub300\uc2e0 \ud654\uba74 \uac1c\ubc1c\uc2dc \uc720\uc0ac\ud55c \ud654\uba74\uc5d0 \ubc18\ubcf5\uc801\uc73c\ub85c \ud3ec\ud568\ub418\ub294 \ucf54\ub529\uc744 \uc870\uae08 \ub354 \uc27d\uac8c \ucc98\ub9ac\ud558\uae30 \uc704\ud55c \ubc29\ubc95\uc744 \uace0\ubbfc\ud558\ub2e4 \ubcf4\ub2c8 \uc624\ud788\ub824 Server side\uc758 library\uac00 \ub354 \uc801\ud569\ud558\ub2e4\ub294 \uc0dd\uac01\uc744 \ud558\uac8c \ub418\uc5c8\ub2e4.<\/p>\n

\uc6b0\uc120 \ubb34\uc791\uc815 \ud558\ub4dc\ucf54\ub529\uc73c\ub85c ExtJs\ub97c \uc774\uc6a9\ud55c page\ub97c \uac1c\ubc1c\ud558\uae30 \uc704\ud574\uc11c\ub294 extjs library\ub97c \uc11c\ubc84\uc5d0 \uc124\uce58\ud558\uace0 \uc774\ub97c \uac01 page\uac00 \ub85c\ub529\ub420 \ub54c \uac19\uc774 \ub85c\ub529\ub420 \uc218 \uc788\ub3c4\ub85d \ud55c\ub2e4.<\/p>\n

\r\n<meta http-equiv=\"X-UA-Compatible\" content=\"IE=7\"> <title>F-square<\/title> \r\n<meta http-equiv=\"Content-Type\" content=\"text\/html; charset=UTF-8\" \/> \r\n<meta http-equiv=\"expires\" content=\"0\" \/> \r\n<meta http-equiv=\"Cache-control\" content=\"no-cache\" \/> \r\n<meta http-equiv=\"Cache-control\" content=\"max-age=0\" \/> \r\n<meta http-equiv=\"pragma\" content=\"no-cache\" \/>\r\n<!-- \uc801\uc6a9\ub41c \ud14c\ub9c8 \uc678\uc5d0 \ucd94\uac00\uc801\uc778 style\uc815\uc758\ub97c \ubaa8\uc544 \ub193\uc740 sheet -->\r\n<link rel=\"stylesheet\" type=\"text\/css\" href=\".\/design\/css\/menu_blue.css\" media=\"screen\" \/>\r\n\r\n<!-- extjs \ud575\uc2ec library -->\r\n<script type=\"text\/javascript\" src=\".\/js\/include-ext.js\"><\/script> \r\n\r\n<script type=\"text\/javascript\" src=\".\/js\/options-toolbar.js\"><\/script>\r\n\r\n<script type=\"text\/javascript\" src=\".\/js\/lib.js\"><\/script>\r\n\r\n<\/pre>\n
\ub514\ub809\ud1a0\ub9ac \uad6c\uc870\ub294 \uac01\uc790\uac00 \uc124\uce58\ud558\uae30 \ub098\ub984\uc774\ubbc0\ub85c \uc124\uce58\ub41c \uacbd\ub85c\ub97c \uadf8\ub300\ub85c \uc368 \uc8fc\uba74\ub418\uaca0\ub2e4.
\n\uba3c\uc800 \uccab\ubc88\uc9f8\uc5d0 meta\ub85c \uc794\ub729 \ub098\uc624\ub294 \ubd80\ubd84\uc740 \uc8fc\ub85c web browser\uc758 cache\ub97c \uc9c0\uc6cc\uc8fc\uae30 \uc704\ud55c \ubd80\ubd84\uc774\ub2e4. \uac01 \ud398\uc774\uc9c0 \ub0b4\uc6a9\uc744 web browser\uac00 cache(PC\uc0c1\uc5d0 \uc784\uc2dc\uc800\uc7a5)\ud558\uace0 \uc788\uc73c\uba74 \uac1c\ubc1c \uc791\uc5c5\uc2dc \ubcc0\uacbd\ubd80\ubd84\uc774 \uc801\uc6a9\ub418\uc9c0 \uc54a\uc544 \ud63c\ub780\uc744 \uc904 \uc218 \uc788\ub2e4. \ub530\ub77c\uc11c \uac00\uae09\uc801 cache\ub294 \uc9c0\uc6cc\ubc84\ub9ac\ub3c4\ub85d \ud558\ub294 \uac83\uc774 \uc88b\ub2e4. \ubc18\ub300\uc758 \uacbd\uc6b0 static\ud55c \ub0b4\uc6a9\uc744 \ubc18\ubcf5\uc801\uc73c\ub85c \ubcf4\uc5ec\uc918\uc57c \ud560 \ub54c\ub294 cache\ub418\uc5b4 \uc788\ub294 \uac83\uc774 \uc18d\ub3c4 \uba74\uc5d0\uc11c\ub294 \ud6e8\uc52c \uc720\ub9ac\ud558\ub2e4.<\/p>\n
\uc774\uc81c \ubcf8\uaca9\uc801\uc73c\ub85c \ucf54\ub529\uc744 \uc2dc\uc791\ud574 \ubcf4\uc790.
\nExtJs\uc124\uce58\uc2dc \ud3ec\ud568\ub418\uc5b4 \uc788\ub294 \uc608\uc81c \ud30c\uc77c\uc744 \ud558\ub098\uc529 \uc18c\uc2a4\uc5d0 \ucd94\uac00\ud574\uc11c \uc2e4\ud589\uc2dc\ucf1c \ubcf4\uba74\uc11c \uadf8 \uad6c\uc870\ub97c \ud30c\uc545\ud558\uba74 \ud6e8\uc52c \uc27d\uac8c \uc774\ud574\ud560 \uc218 \uc788\ub2e4.<\/p>\n
\uc5ec\uae30\uc11c\ub294 FeedViewer Demo\uc640 Tree, Tab\uc744 \uc774\uc6a9\ud558\uc5ec \ud654\uba74\uc744 \uad6c\uc131\ud558\uace0 \ub0b4\ubd80 \ud654\uba74\uc740 iframe\uc73c\ub85c \uac04\ub2e8\ud788 \uc815\ubcf4\uc870\ud68c \ud654\uba74\uc744 \uad6c\uc131\ud558\ub3c4\ub85d \ud558\uc600\ub2e4.
\n\ud3b8\uc9d1\uae30\ub294 Text Editor\uc640 vi\ub97c \ud63c\uc6a9\ud558\uc600\uace0, \ud14c\uc2a4\ud2b8\ub294 Web brower\ub85c \uc9c1\uc811 \ud654\uba74\uc744 \ubcf4\uba74\uc11c \uc218\uc815\uc744 \ud558\uc600\ub2e4(Subscription\uac00\uc785\uc744 \ud558\uc9c0 \uc54a\uc544 UI-Designer\ub97c \uad6c\ud558\uc9c0\ub294 \ubabb\ud588\ub2e4).<\/p>\n
<script type=\"text\/javascript\">\r\n\r\nExt.onReady(function() {\r\n    Ext.QuickTips.init();\r\n    var viewport = Ext.create('Ext.Viewport', {\r\n    id: 'border-example',\r\n    layout: 'border',\r\n    items: [\r\n        \/\/ create instance immediately\r\n        Ext.create('Ext.Component', {\r\n            region: 'north',      \/\/ \ud654\uba74\uc758 \ubd81\ucabd(\uc717\ucabd)\uc5d0 \uc704\uce58\r\n            height: 58, \/\/ give north and south regions a height \r\n            autoEl: {\r\n                tag: 'div'\r\n            }\r\n        }), {\r\n\r\n            \/\/ lazily created panel (xtype:'panel' is default)\r\n            region: 'south',  \/\/ \ud654\uba74\uc758 \ub0a8\ucabd(\uc544\ub7ab\ucabd)\uc5d0 \uc704\uce58\ud558\ub294 panel\r\n            contentEl: 'south', \/\/ div id='south'\ub77c\uace0 \ud558\ub294 content\ub97c overriding\ud568\r\n            split: true,  \/\/ \ud06c\uae30\uc870\uc815\uc774 \uac00\ub2a5\ud55c split\r\n            height: 70,\r\n            minSize: 100,\r\n            maxSize: 200,\r\n            collapsible: true,\r\n            collapsed: true,\r\n            title: 'Ticker',\r\n            margins: '0 0 0 0'\r\n        },\r\n\r\n        {\r\n            region: 'west',            \/\/ \ud654\uba74\uc758 \uc11c\ucabd(\uc67c\ucabd)\uc5d0 \uc704\uce58\r\n            stateId: 'navigation-panel',\r\n            id: 'west-panel', \/\/ see Ext.getCmp() below\r\n            title: 'Menu',\r\n            split: true,  \/\/ \ud06c\uae30\uc870\uc815\uc774 \uac00\ub2a5\ud55c split\r\n            width: 200,\r\n            minWidth: 175,\r\n            maxWidth: 400,\r\n            collapsible: true,  \/\/ \ub2eb\ud798 \uae30\ub2a5\uc774 \uac00\ub2a5\r\n            animCollapse: true,  \/\/ \ub2eb\ud790\ub54c \uc560\ub2c8\uba54\uc774\uc158 \uc801\uc6a9\r\n            margins: '0 0 0 5',\r\n            layout: 'accordion',  \/\/ accordion layout\uc73c\ub85c \ud0ed\ub4e4\uc774 \uc874\uc7ac\r\n            items: [{             \/\/ accordion layout\uc73c\ub85c \uc874\uc7ac\ud558\ub294 \ud0ed\uc758 \uc544\uc774\ud15c\ub4e4\r\n                    title: '\uc990\uaca8\ucc3e\uae30',\r\n                    xtype: 'treepanel',             \/\/  tree panel object \uc0dd\uc131\r\n                    id: 'favorit',\r\n                    iconCls: 'nav',                 \/\/ style\ub85c \uc815\uc758\ub41c 'nav' icon\r\n                    margins: '2 2 0 2',\r\n                    autoScroll: true,\r\n                    rootVisible: false,\r\n                    root: { text: \"Root Node\",      \/\/ tree\uc758 node\uc758 \uc815\uc758\r\n                        children:[\r\n                            {text:'\uba54\ub2741', id: 'PMS_0001', leaf:true},   \/\/ \uac01\uac01\uc758 \uba54\ub274\r\n                            {text:'\uba54\ub274100', id: 'PMS_0100', leaf:true}\r\n                        ]\r\n                    },\r\n\r\n                    listeners: {\r\n                        itemclick : function(s,d){                \/\/ tree menu\ub97c click \ud588\uc744\ub54c\uc758 action\r\n                            if ( d.data.leaf ) {\r\n                                var scr_id = \"S\" + d.data.id;\r\n                                var scr_title = d.data.text;\r\n                                var scr_filename = \"PMS\/SG\" + d.data.id.trim() + \"_SUB.php?theme=neptune\";    \/\/ PMS\ub514\ub809\ud1a0\ub9ac \ub0b4\uc5d0\uc788\ub294 php\ud30c\uc77c\uba85 \uc0dd\uc131\r\n                                var tab = Ext.getCmp( scr_id );\r\n                                var mainPanel = Ext.getCmp('MainPanel');\r\n                                if ( tab != null ) {\r\n                                    mainPanel.setActiveTab(tab);  \/\/ \ub9cc\uc57d \uc774\ubbf8 \ud654\uba74\uc774 \uc5f4\ub824\uc788\uc73c\uba74 \ud574\ub2f9 \ud654\uba74\uc744 activate\uc2dc\ud0b4\r\n                                }\r\n                                else {\r\n                                    var tab = new Ext.Panel({      \/\/ \uc0c8\ub85c\uc6b4 \ucc3d\uc5d0 \ud654\uba74\uc744 open\r\n                                        id: scr_id,\r\n                                        title: scr_title,\r\n                                        closable:true,\r\n                                        autoScroll: false,\r\n                                        border:false,\r\n                                        layout:'fit',\r\n                                        frame: false,\r\n                                        html: '<iframe src=\"' + scr_filename + '\" frameborder=\"no\" allowtransparency=\"y\" vspace=\"0\" hspace=\"0\" width=\"100%\" height=\"100%\"><\/iframe>'  \/\/ iframe\uc73c\ub85c tab \ub0b4\uc5d0\uc11c \ud654\uba74\uc744 open\ud568\r\n                                    });\r\n\r\n                                    mainPanel.add(tab);\r\n                                    mainPanel.setActiveTab(tab);  \/\/ tab\uc744 add\ud558\uace0 activate\ud568\r\n                                }\r\n                            } \/\/ if ( d.data.leaf ) \uc758 \ub05d\r\n                        } \/\/ itemclick : function(s,d)\uc758 \ub05d\r\n                    } \/\/ listener\uc758 \ub05d\r\n                    }, {\r\n                        title: '\uc790\uae08\uad00\ub9ac',\r\n                        xtype: 'treepanel',\r\n                        id: 'Fund-manager',\r\n                        iconCls: 'info',\r\n                        margins: '2 2 0 2',\r\n                        autoScroll: true,\r\n                        rootVisible: false,\r\n                        root: { text: \"Root Node\",\r\n                            children:[\r\n                                { text: '<b>\uba54\ub2741<\/b>', id: 'PMS_0001', leaf:true},\r\n                                { text: '<b>\uba54\ub2742<\/b>', id: 'PMS_0002', leaf:true},\r\n                                { text: '<b>\uba54\ub274100<\/b>', id: 'PMS_0100', leaf:true},\r\n                                { text: '<b>\uba54\ub274200<\/b>', id: 'PMS_0200', leaf:true}\r\n                            ]\r\n                        },\r\n\r\n                        listeners: {\r\n                        itemclick : function(s,d){\r\n                            if ( d.data.leaf ) {\r\n                                var scr_id = \"S\" + d.data.id;\r\n                                var scr_title = d.data.text;\r\n                                var scr_filename = \"PMS\/SG\" + d.data.id.trim() + \"_SUB.php?theme=neptune\";\r\n                                var tab = Ext.getCmp( scr_id );\r\n                                var mainPanel = Ext.getCmp('MainPanel');\r\n                                if ( tab != null ) {\r\n                                    mainPanel.setActiveTab(tab);\r\n                                }\r\n                                else {\r\n                                    var tab = new Ext.Panel({\r\n                                        id: scr_id,\r\n                                        title: scr_title,\r\n                                        closable:true,\r\n                                        autoScroll: false,\r\n                                        border:false,\r\n                                        layout:'fit',\r\n                                        frame: false,\r\n                                        html: '<iframe src=\"' + scr_filename + '\" frameborder=\"no\" allowtransparency=\"y\" vspace=\"0\" hspace=\"0\" width=\"100%\" height=\"100%\"><\/iframe>'\r\n                                    });\r\n\r\n                                    mainPanel.add(tab);\r\n                                    mainPanel.setActiveTab(tab);\r\n                                }\r\n                            } \/\/ if ( d.data.leaf ) \uc758 \ub05d\r\n                        } \/\/ itemclick : function(s,d)\uc758 \ub05d\r\n                    } \/\/ listener\uc758 \ub05d\r\n                    }, {\r\n                        title: '\ud658\uacbd\uc124\uc815',\r\n                        xtype: 'treepanel',\r\n                        id: 'tree-config',\r\n                        iconCls: 'settings',\r\n                        margins: '2 2 0 2',\r\n                        autoScroll: true,\r\n                        rootVisible: false,\r\n                        root: { text: \"Root Node\",\r\n                            children:[\r\n                                {text:'\uc990\uaca8\ucc3e\uae30 \uc124\uc815', id: 'CFG_1000', leaf:true},\r\n                                {text:'\ud654\uba74 \uc124\uc815', id: 'CFG_2000', leaf:true}\r\n                            ]\r\n                        },\r\n\r\n                        listeners: {\r\n                            itemclick : function(s,d){\r\n                                if ( d.data.leaf ) {\r\n                                    var scr_id = \"S\" + d.data.id;\r\n                                    var scr_title = d.data.text;\r\n                                    var scr_filename = \"CFG\/S\" + d.data.id.trim() + \".php?theme=neptune\";\r\n                                    var tab = Ext.getCmp( scr_id );\r\n                                    var mainPanel = Ext.getCmp('MainPanel');\r\n                                    if ( tab != null ) {\r\n                                        mainPanel.setActiveTab(tab);\r\n                                }\r\n                                else {\r\n                                    var tab = new Ext.Panel({\r\n                                        id: scr_id,\r\n                                        title: scr_title,\r\n                                        closable:true,\r\n                                        autoScroll: false,\r\n                                        border:false,\r\n                                        layout:'fit',\r\n                                        frame: false,\r\n                                        html: '<iframe src=\"' + scr_filename + '\" frameborder=\"no\" allowtransparency=\"y\" vspace=\"0\" hspace=\"0\" width=\"100%\" height=\"100%\"><\/iframe>'\r\n                                    });\r\n\r\n                                    mainPanel.add(tab);\r\n                                    mainPanel.setActiveTab(tab);\r\n                                }\r\n                            }\r\n                        }\r\n                    }\r\n                }\r\n            ]\r\n        },\r\n\r\n        Ext.create('Ext.tab.Panel', {   \/\/ \ud654\uba74\uc758 \uac00\uc6b4\ub370 tab panel\uc0dd\uc131 (mainpanel\uc774\ub77c\uace0 \uba85\uba85)\r\n            region: 'center', \/\/ a center region is ALWAYS required for border layout\r\n            deferredRender: false,\r\n            bodyStyle: 'background-size:contain; background-image:url(http:\/\/www.nyewall.com\/images\/2013\/07\/background-flowers-sky-wallpaper-blue-nice-wallpapers.jpg);',\r\n            id: 'MainPanel',\r\n            activeTab: 0 \/\/ first tab initially active\r\n        })]\r\n    });\r\n\r\n    \/\/ get a reference to the HTML element with id \"hideit\" and add a click listener to it\r\n    Ext.get(\"hide-it\").on('click', function(){\r\n        var w = Ext.getCmp('west-panel');\r\n        w.collapsed ? w.expand() : w.collapse();\r\n    });\r\n});\r\n<\/script>\r\n\r\n<body bgcolor=\"#F0F0FF\" \/* onload=reqeustFullScreen();*\/>\r\n<table width=100% border=0 cellpadding=0 cellspacing=0 >\r\n<tr><td align=left width=145 class=\"logo\">AMS<\/td><td align=left class=\"logo\"><\/td><\/tr>\r\n<tr><td align=left width=145 class=\"logo_under\">&nbsp; Management System<\/td><td class=\"logo_under\">- AMS Consulting<\/td><\/tr>\r\n<\/table>\r\n\r\n<!-- use class=\"x-hide-display\" to prevent a brief flicker of the content -->\r\n<div id=\"west\" class=\"x-hide-display\">\r\n<p>west panel<\/p>\r\n<\/div>\r\n<div id=\"center2\" class=\"x-hide-display\">\r\n<a id=\"hide-it\" href=\"#\"> <\/div>\r\n<div id=\"center1\" class=\"x-hide-display\">\r\n<\/div>\r\n<\/div>\r\n<div id=\"south\" class=\"x-hide-display\">\r\n<p>\uc815\uc0c1\uc0c1\ud0dc<\/p>\r\n<\/div>\r\n<br\/><\/pre>\n
\uc774\uc81c \ud574\ub2f9 library\uc640 style sheet\uac00 \uc801\uc808\ud55c \uacbd\ub85c\uc5d0 \uc124\uce58\ub9cc \ub418\uc5b4 \uc788\ub2e4\uba74 \uccab\ubc88\uc9f8 \uba54\uc778 \ud654\uba74\uc774 \uc815\uc0c1\uc801\uc73c\ub85c \ub730 \uac83\uc774\ub2e4.
\n\"fundratings\"<\/a>
\n\uc774\uc81c \uba54\uc778\ud654\uba74\uc744 \uc0dd\uc131\ud588\uace0 \uc55e\uc73c\ub85c \ud574\uc57c\ud560 \ud30c\uc77c\uc740 \uac01 \uba54\ub274\ub97c \ud074\ub9ad\ud588\uc744 \ub54c iframe\uc0c1\uc5d0 \ub730 \uac01\uac01\uc758 \ud654\uba74 \ud30c\uc77c\uc744 \uc0dd\uc131\ud558\ub294 \uc77c\ub9cc \ub0a8\uc558\ub2e4.
\n\uadf8\ub7f0\ub370 \uba54\uc778\ud654\uba74\uc744 \uc790\uc138\ud788 \ubcf4\uba74 \ubc18\ubcf5\uc801\uc778 \ubd80\ubd84\ub4e4\uc774 \ubcf4\uc77c\uac83\uc774\ub2e4. \uc989, tree menu\uac00 \uc990\uaca8\ucc3e\uae30, \ud654\uba74\uba54\ub274, \ud658\uacbd\uc124\uc815 \ub4f1\uacfc \uac19\uc774 \ub3d9\uc77c\ud55c \ud615\ud0dc\uc758 \uc790\ub8cc\uad6c\uc870\ub85c \ubc18\ubcf5\ub418\ub294 \uac83\uc744 \ubcfc \uc218 \uc788\ub294\ub370 \uc774\ub7ec\ud55c \ubd80\ubd84\uc744 \ubaa8\ub450 Hard coding\uc73c\ub85c fix\ud558\uc9c0 \ub9d0\uace0 \uc11c\ubc84\uce21\uc5d0\uc11c \ub3d9\uc801\uc73c\ub85c DB\ub97c \uc870\ud68c\ud558\uc5ec \uc0dd\uc131\ud558\uba74 \ubc18\ubcf5\uc791\uc5c5\uc774 \ud6e8\uc52c \uc904\uc5b4\ub4e4 \uac83\uc774\ub2e4.<\/p>\n
index.php\r\n<header>\r\n...\r\n<script type=\"text\/javascript\">\r\n\r\n...\r\n<?         include 'lib\/db.php';\r\n         \/\/ db \uc870\ud68c\uc2dc\uc791\r\n         ....\r\n         \/\/ \uc870\ud68c \uacb0\uacfc\ub97c \ucd9c\ub825\r\n         ...\r\n         while ( $rs = mssql.next() ) {                   if ($row_cnt > 0 ) echo \",\\n\";\r\n                  echo \"{ text : '\" . $rs.getString(1) . \"', id : \" . $rs.getString(2) . \", leaf : \" . $rs.getString(5) . \"}\";\r\n                  $row_cnt ++;\r\n      }\r\n\r\n?>\r\n     }\r\n   ]<\/pre>\n","protected":false},"excerpt":{"rendered":"
Extjs\ub97c \uc124\uce58\ud588\ub2e4\uba74 \uc774\uc81c sample\ub4f1\uc744 \uc798 \ud65c\uc6a9\ud558\uc5ec \uc0ac\uc6a9\ud558\uae30\ub9cc \ud558\uba74 \ub41c\ub2e4. ExtJs\ub97c \uc0ac\uc6a9\ud558\uae30 \uc704\ud574\uc11c\ub294 ExtJs\uc758 \uae30\ubcf8 \uad6c\uc870\ub97c \uc798 \uc774\ud574\ud574\uc57c \ud55c\ub2e4. ExtJs\ub294 Client Side Script\uc778 javascript\ub85c \uc774\ub8e8\uc5b4\uc9c4 Web \uac1c\ubc1c library\uc774\ub2e4. \uc774 library\uac00 \uacf5\ud1b5\uc73c\ub85c \ud654\uba74\uc5d0 \ub85c\ub529\ub418\uace0 \uadf8 \uc0c1\ud0dc\uc5d0\uc11c \uc0ac\uc6a9\uc790\uac00 \uc791\uc131\ud55c \ud654\uba74 script\uac00 \uc2e4\ud589\ub418\ub294 \ud615\uc2dd\uc774\ub2e4. Sencha\uc5d0\uc11c \uc81c\uc548\ud558\ub294 \ub610 \ub2e4\ub978 \ubc29\ubc95\uc740 extjs\ub97c \ud65c\uc6a9\ud558\uc5ec \ud654\uba74 \uad6c\uc131\uc5d0 \ud544\uc694\ud55c \uc0c8\ub85c\uc6b4 library\ub97c \uc0dd\uc131\ud558\uc5ec \uc774\ub97c \ubc30\ud3ec\ud558\ub294 […]<\/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-115","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\/115","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=115"}],"version-history":[{"count":10,"href":"https:\/\/www.fsquare.co.kr\/index.php?rest_route=\/wp\/v2\/posts\/115\/revisions"}],"predecessor-version":[{"id":126,"href":"https:\/\/www.fsquare.co.kr\/index.php?rest_route=\/wp\/v2\/posts\/115\/revisions\/126"}],"wp:attachment":[{"href":"https:\/\/www.fsquare.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=115"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.fsquare.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=115"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.fsquare.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=115"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}