日历形式实现解析荐

         一、模块主页进入模块到达起始页index.html，含有一个Ext的TabPanel，其内部为Ext.ui扩展的mpanel，并初始化加载一个处理读取并格式化过的数据，其内容为html格式，展示数据。 service.js
Ext.BLANK_IMAGE_URL = '../ext/resources/images/default/s.gif';
var tab_win;
var grid;
var xpanel
var mpanel = Ext.ux.ManagedIframePanel;
var CONTAINER;
Ext.onReady(function() {
  Ext.QuickTips.init();
  var grid_width;
  var grid_height;
  if (Ext.isIE6) {
    grid_width = document.body.clientWidth - 2;
    grid_height = document.body.clientHeight - 2;
  } else if (Ext.isIE7) {
    grid_width = document.documentElement.clientWidth - 2;
    grid_height = document.documentElement.clientHeight - 2;
  } else {
    grid_width = self.innerWidth - 2;
    grid_height = self.innerHeight - 2;
  }
    
  // toobar for grid
  var toolbar = new Ext.Toolbar(['->', {
  'text' : '刷新',
  iconCls : 'fresh',
  handler : reload
  }]);

    xpanel = new mpanel ({    
      title : title,
      tbar : toolbar,
      closable : false,
      frameBorder: 0,
      height : grid_height,
      width : grid_width,
      loadMask : {
      msg : '正在加载添加页面...',
      disable : false
    },        
    defaultSrc:url1
  });    
    
  tab_win = new Ext.TabPanel({
    renderTo : 'x-like18-calendar-grid',
    activeTab : 0,
    height : grid_height,
    width : grid_width,
    frame : true,
    plain : false,
    items : [xpanel]
  });
  CONTAINER = tab_win;    
  function reload(){    
    xpanel.setSrc(url1);    
  }
});

function reback(dat.){    
  if(dat. != "") {
    xpanel.setSrc(url2+dat.);    
  } else {
    xpanel.setSrc(url1);    
  }
}





 生成的页面中进行处理数据时候调用父页面的函数：定义参数var $status = "title:'处理订单',  closable : true,loadMsk : {  msg:'正在加载添加页面...',  disable : false  },";调用父页面operate函数$_tmp ['@OPERATE@'] = '<button .click="parent.operate(\'dfdf'.$item ['order_no'].'\',{'.$this->status.'defaultSrc:\'../../backyardorderflow/?Command=WorkFlow&order_no='.$item['order_no'].'&flow=1\'})">处理</button>'; operate:function operate(id,config) {
  if ('undefined' === typeof CONTAINER) {
    alert('没有定义CONTAINER变量,无法打开会员信息页面!');
    return;
  }

  var xpanel = Ext.getCmp(id);
  if (xpanel != null) {
    CONTAINER.remove(xpanel);
    xpanel.destroy();
  }
  xpanel = new Ext.ux.ManagedIframePanel(config);
  CONTAINER.add(xpanel);
  CONTAINER.setActiveTab(xpanel);
} 实现xpanel的更换，同时加载处理的详细页面信息，这个见二。 defaultSrc:\'../../backyardorderflow/?Command=WorkFlow&order_no='.$item['order_no'].'&flow=1 该页搜索功能单日查看模式：利用jquery初始化页面绑定时间空间到对于ID上，并定义触发函数进行调用相应模块重载页面数据操作，$(function(){    
  $('#today').datepicker({showOn: "both", buttonImage: "../datepicker.gif", buttonImageOnly: true,onSelect:function(){
      var view_day = $('#today').val();
      var args = $('#args').val();
      $.blockUI('<img src="../loading.gif"/>');
      window.location = args + '&view_day=' + view_day;
  }});
  $('a').mousemove(function(){        
      window.status = 'XXX后台管理';
  });
});对于超级链接形式的查看前一天或后一天，则直接进行链接。 时间段查看模式：与单日模式类似，定义两个时间输入点（input），绑上时间控件，定义搜索按钮，并设置其调用函数，函数中调用jquery插件进行页面跳转。$.akModalHideAndRedirect(url);    二、处理页面待续...