title: Sencha Touch - How to remove/hide popup panel on button click
body: <p>I have created Panel as bellow</p>
  
  <pre><code>Ext.define('MyApp.view.DatePanel', {
  extend: 'Ext.Panel',
  alias: 'widget.DatePanel',
  config: {
      itemid:'DatePanel',
      modal:true,
      centered: true,
      width:'320px',
      height:'110px',   
      items:[
              {
                  xtype: 'datepickerfield',
                  label: 'Select date',
                  type:'date',
                  itemId: 'rptDate',
                  value: new Date(),
              },
              {
                  xtype:'toolbar',
                  docked:'bottom',
                  items:[{
                      text:'OK',
                      ui:'confirm',
                      action:'ShowTurnOverReport'
                  },
                  {
                      text:'Cancel',
                      ui:'confirm',
                      action:'Cancel'
                  }
  
              }
          ]
  }
  </code></pre>
  
  <p>});</p>
  
  <p>I show this panel as Pop-up using bellow code</p>
  
  <pre><code>Ext.Viewport.add({xtype: 'DatePanel'});
  </code></pre>
  
  <p>Now on Button cancel click i want to hide/remove it</p>
  
  <p>I have tried </p>
  
  <pre><code>Ext.Viewport.remove(Datepanel), 
  var pnl = Ext.getCmp('DatePanel');
  pnl.hide();
  </code></pre>
  
  <p>but nothing worked. how can i do this ??</p>