grid store\ub97c load\ud558\uae30 \uc704\ud55c \uc77c\ubc18\uc801\uc778 \ubc29\ubc95\uc740 button \ub4f1\uc758 action\uc5d0 grid.store\uc758 \uc18d\uc131\uc744 \uc9c0\uc815\ud558\uc5ec grid.store.load()\ub97c \uc2e4\ud589\uc2dc\ud0a8\ub2e4.
\ngrid.store\uc758 \uc18d\uc131\uc73c\ub85c\ub294 store.proxy.url\uc744 \uc9c0\uc815\ud558\uace0 load()\ud568\uc218\ub97c \ud638\ucd9c\ud558\uba74 proxy\uac00 url\uc744 \ud638\ucd9c \ud560 \ub54c GET \ubc29\uc2dd\uc744 \uc0ac\uc6a9\ud55c\ub2e4.<\/p>\n
Ext.define('GridList_Model',{\r\n extend: 'Ext.data.Model',\r\n proxy: {\r\n type: 'ajax',\r\n reader: 'json'\r\n },\r\n fields: [ 'field1','field2','field3','field4','field5','field6','field7','field8' ]\r\n});\r\n\r\n\/\/ create the Data Store\r\nvar GridList_store = Ext.create('Ext.data.Store', {\r\n model: 'GridList_Model<\/b>',\r\n autoLoad: false,\r\n proxy: {\r\n type: 'ajax',\r\n url: '\/query\/JSON_GRID1.jsp',\r\n reader: {\r\n type: 'json'\r\n }\r\n }\r\n});\r\n\r\nGriList_store.on('load', function(){ AfterGrid(); });\r\n\r\n\/\/ create the grid\r\nvar GridMasterList = Ext.create('Ext.grid.Panel', {\r\n id: 'GridList',\r\n \/\/ data of this grid comes from 'GridList_store' store\r\n store: GridList_store,\r\n columnLines: true,\r\n ...\r\n} \/\/ end of grid definition\r\n\r\nExt.create('Ext.form.FormPanel', {\r\n width: 1024,\r\n id: 'SearchForm',\r\n margin: '0 0 10 0',\r\n xtype: 'fieldset',\r\n layout: 'column',\r\n border: 1,\r\n items: [{\r\n xtype: 'datefield',\r\n fieldLabel: '\uae30\uc900\ub0a0\uc9dc',\r\n format: 'Y-m-d',\r\n id: 'BaseDate1',\r\n maxLength:10,\r\n width:300 ,\r\n ...\r\n\r\n\r\n\r\n<\/pre>\n <\/p>\n
GET \ubc29\uc2dd\uc740 URL\uc5d0 parameter\ub97c \ubd99\uc5ec \uc804\uc1a1\ud558\ub294 \ubc29\uc2dd\uc774\ub2e4. <\/br><\/p>\n
\r\n\/\/ form submit button definition....\r\nxtype: 'button',\r\nid: 'OkButton',\r\nwidth: '120',\r\nheight: '30',\r\nmargin: '10px 10px 10px 10px',\r\nhandler: function() {\r\n var date1 = Ext.getCmp('BaseDate1');\r\n var baseday = date1.getSubmitValue().replace(\"\/g\", \"-\");\r\n baseday = baseday.replace(\/-\/g, \"\");\r\n\r\n var name = Ext.getCmp('Name').value();\r\n var addr = Ext.getCmp('Address').value();\r\n\r\n Ext.getCmp('GridList').show();\r\n\r\n \/\/ store : store of grid. store is data part of 'GridList' grid...\r\n var store = Ext.getCmp('GridList').getStore();\r\n \/\/ add parameter to url with '?' and '&' parameter...\r\n \/\/ : url = 'http:\/\/www.xxx.com\/query.jsp?data1=Hi&data2=Hello&data3=world\r\n store.proxy.url = \"\/query\/JSON_GRID1.jsp?DATE=\"+baseday+'&NAME=' + name + '&ADD=' + addr;;\r\n store.load();\r\n},\r\ntext: '\uac80\uc0c9'\r\n<\/pre>\n <\/p>\n
Form\uc758 Field\uac00 \ub9ce\uc740 \uacbd\uc6b0 field\ub97c \ubaa8\ub450 parameter\ub97c \ubaa8\ub450 url\ub85c \uc9c0\uc815\ud574\uc57c \ud55c\ub2e4. \uadf8\ub7f0\ub370 ajax\ub85c \uc11c\ubc84\uc5d0 request\ub97c \ubcf4\ub0b4\ub294 \uacbd\uc6b0 \uaf2d GET \ubc29\uc2dd\ub9cc \ubcf4\ub0bc \uc218 \uc788\ub294 \uac83\uc774 \uc544\ub2c8\ub2e4. POST \ubc29\uc2dd\ub3c4 \uac00\ub2a5\ud558\ub2e4. ExtJs API\uc5d0\ub294 \ub098\uc640\uc788\uc9c0 \uc54a\uc9c0\ub9cc POST \ubc29\uc2dd\uc73c\ub85c \ub370\uc774\ud130\ub97c \ubcf4\ub0b4\uba74 URL\uc774 \uac04\ub2e8\ud558\uace0 \uc5ec\ub7ec\uac1c\uc758 parameter\ub97c \uc2e4\uc218 \uc5c6\uc774 \ubcf4\ub0bc \uc218 \uc788\ub2e4.<\/p>\n
\r\nxtype: 'button',\r\nid: 'OkButton',\r\nwidth: '120',\r\nheight: '30',\r\nmargin: '10px 10px 10px 10px',\r\nhandler: function() {\r\n var frm = this.up('form').getForm();\r\n var values = frm.getValues();\r\n \/\/ values is object ( 'values' is record type )\r\n \/\/ parameters are object's record\r\n\r\n Ext.getCmp('GridList').show();\r\n\r\n var store = Ext.getCmp('GridrList').getStore();\r\n store.proxy.url = \"\/query\/JSON_GRID1.jsp\";\r\n \/\/ change actionMethod.read as POST\r\n store.proxy.actionMethods.read = \"POST\";\r\n \/\/ ajax parameters are form field values...(Object)\r\n store.proxy.extraParams = values;\r\n store.load();\r\n},\r\ntext: '\uac80\uc0c9'\r\n<\/pre>\nPOST \ubc29\uc2dd\uc73c\ub85c \ubcf4\ub0b4\uba74 \ub2f9\uc5f0\ud788 \uac01 parameter\ub97c \uc77c\uc77c\uc774 \uc9c0\uc815\ud558\uc9c0 \uc54a\uc544\ub3c4 form\uc5d0 \uc788\ub294 \ubaa8\ub4e0 field \uac00 \uc804\ub2ec\ub418\ubbc0\ub85c \uc27d\uace0 \ud3b8\ub9ac\ud558\ub2e4.store.proxy.extraParams<\/b>\uc5d0 ‘values’ Object\ub97c \uc9c0\uc815\ud558\uace0 actionMethods.read<\/b>\ub97c POST\ub85c \uc9c0\uc815\ud558\uc5ec store.load()\ub97c \uc2e4\ud589\ud558\uba74 Server\uce21\uc5d0\ub294 data\uac00 POST \ubc29\uc2dd\uc73c\ub85c \uc804\ub2ec\ub41c\ub2e4. \uc774 \ub54c Server\uce21\uc5d0 \uc804\ub2ec\ub418\ub294 \ubcc0\uc218 \uba85\uc740 \uac01 field\uc758 id \uc774\ub2e4.<\/p>\n
<\/p>\n","protected":false},"excerpt":{"rendered":"
grid store\ub97c load\ud558\uae30 \uc704\ud55c \uc77c\ubc18\uc801\uc778 \ubc29\ubc95\uc740 button \ub4f1\uc758 action\uc5d0 grid.store\uc758 \uc18d\uc131\uc744 \uc9c0\uc815\ud558\uc5ec grid.store.load()\ub97c \uc2e4\ud589\uc2dc\ud0a8\ub2e4. grid.store\uc758 \uc18d\uc131\uc73c\ub85c\ub294 store.proxy.url\uc744 \uc9c0\uc815\ud558\uace0 load()\ud568\uc218\ub97c \ud638\ucd9c\ud558\uba74 proxy\uac00 url\uc744 \ud638\ucd9c \ud560 \ub54c GET \ubc29\uc2dd\uc744 \uc0ac\uc6a9\ud55c\ub2e4. Ext.define(‘GridList_Model’,{ extend: ‘Ext.data.Model’, proxy: { type: ‘ajax’, reader: ‘json’ }, fields: [ ‘field1′,’field2′,’field3′,’field4′,’field5′,’field6′,’field7′,’field8’ ] }); \/\/ create the Data Store var GridList_store = Ext.create(‘Ext.data.Store’, { model: ‘GridList_Model’, […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[8,7],"tags":[],"class_list":["post-297","post","type-post","status-publish","format-standard","hentry","category-extjs","category-it"],"_links":{"self":[{"href":"https:\/\/www.fsquare.co.kr\/index.php?rest_route=\/wp\/v2\/posts\/297","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=297"}],"version-history":[{"count":4,"href":"https:\/\/www.fsquare.co.kr\/index.php?rest_route=\/wp\/v2\/posts\/297\/revisions"}],"predecessor-version":[{"id":317,"href":"https:\/\/www.fsquare.co.kr\/index.php?rest_route=\/wp\/v2\/posts\/297\/revisions\/317"}],"wp:attachment":[{"href":"https:\/\/www.fsquare.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=297"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.fsquare.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=297"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.fsquare.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=297"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}