Don't like ads? PRO users don't see any ads ;-)
Guest

Untitled

By: a guest on Jul 29th, 2012  |  syntax: None  |  size: 4.37 KB  |  hits: 49  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. ExtJS polling provider to poll rest call from server using store and grid
  2. //Create store object to store json data from webservice call
  3.         var store = Ext.create('Ext.data.Store', {
  4.                 autoLoad : true,
  5.                 autoSync : true,
  6.                 model : 'MuleJson',
  7.                 proxy : {
  8.                     type : 'rest',
  9.                     url : '/list',
  10.                     reader : {
  11.                         type : 'json',
  12.                         root : 'data'
  13.                     },
  14.                     writer : {
  15.                         type : 'json'
  16.                     }
  17.                 },
  18.                 listeners : {
  19.                     write : function(store, operation) {                
  20.                         var record = operation.getRecords()[0], name = Ext.String
  21.                                 .capitalize(operation.action), verb;
  22.  
  23.                         if (name == 'Destroy') {
  24.                             record = operation.records[0];
  25.                             verb = 'Destroyed';
  26.                         } else {
  27.                             verb = name + 'd';
  28.                         }
  29.                         Ext.example.msg(name, Ext.String.format(
  30.                                         "{0} user: {1}", verb, record.getId()));
  31.  
  32.                     }
  33.                 }
  34.             });
  35.  
  36.  
  37.  
  38.     var rowEditing = Ext.create('Ext.grid.plugin.RowEditing');
  39.  
  40.  
  41.     //Create a grid panel to hold the store data
  42.     grid = Ext.create('Ext.grid.Panel', {
  43.                 renderTo: 'notificationId',
  44.                 plugins : [rowEditing],
  45.                 width : 500,
  46.                 height : 300,
  47.                 frame : true,
  48.                 title : 'Notifications',
  49.                 tools : getTools(),
  50.                 store : store,
  51.                 iconCls : 'icon-notification',
  52.                 columns : [{
  53.                             text : 'ID',
  54.                             width : 40,
  55.                             sortable : true,
  56.                             dataIndex : '_id'
  57.                         }, {
  58.                             text : 'Form 1',
  59.                             flex : 1,
  60.                             sortable : true,
  61.                             dataIndex : 'form1name',
  62.                             field : {
  63.                                 xtype : 'textfield'
  64.                             }
  65.                         }, {
  66.                             header : 'Form 2',
  67.                             width : 80,
  68.                             sortable : true,
  69.                             dataIndex : 'form2name',
  70.                             field : {
  71.                                 xtype : 'textfield'
  72.                             }
  73.                         }, {
  74.                             text : 'Form 3',
  75.                             width : 80,
  76.                             sortable : true,
  77.                             dataIndex : 'form3name',
  78.                             field : {
  79.                                 xtype : 'textfield'
  80.                             }
  81.                         }],
  82.                 dockedItems : [{
  83.                     xtype : 'toolbar',
  84.                     items : [{
  85.                                 text : 'Add',
  86.                                 iconCls : 'icon-add',
  87.                                 handler : function() {
  88.                                     // empty record
  89.                                     store.insert(0, new MuleJson());
  90.                                     rowEditing.startEdit(0, 0);
  91.                                 }
  92.                             }, '-', {
  93.                                 itemId : 'delete',
  94.                                 text : 'Delete',
  95.                                 iconCls : 'icon-delete',
  96.                                 disabled : true,
  97.                                 handler : function() {
  98.                                     var selection = grid.getView()
  99.                                             .getSelectionModel().getSelection()[0];
  100.                                     if (selection) {
  101.                                         store.remove(selection);
  102.                                     }
  103.                                 }
  104.                             }]
  105.                 }]              
  106.             });
  107.        
  108. Ext.direct.Manager.addProvider(
  109.     {
  110.         type:'polling',
  111.         url: myTestFunction,
  112.         id: 'json poll',
  113.         interval: 5000  
  114.     }
  115. );
  116.  
  117. var pollB = Ext.direct.Manager.getProvider('json poll');