git.roojs.org Git - roojs1/blob - examples/bootstrap/modal.js

   1 /*
   2  * To change this template, choose Tools | Templates
   3  * and open the template in the editor.
   4  */
   5
   6
   7
   8 Roo.example = Roo.example || {};
   9
  10 Roo.example.modal= function() {}
  11 Roo.apply(Roo.example.modal, {
  12  dialog : false,
  13  callback:  false,
  14
  15  show : function(data, cb)
  16  {
  17   if (!this.dialog) {
  18    this.create();
  19   }
  20
  21   this.callback = cb;
  22   this.data = data;
  23   this.dialog.show(this.data._el);
  24   if (this.form) {
  25    this.form.reset();
  26    this.form.setValues(data);
  27    this.form.fireEvent('actioncomplete', this.form,  { type: 'setdata', data: data });
  28   }
  29
  30  },
  31
  32  create : function()
  33  {
  34
  35         var _this = this;
  36
  37         this.dialog = Roo.factory({
  38             xtype: 'Modal',
  39             xns: Roo.bootstrap,
  40             title : "Login",
  41             buttons : Roo.bootstrap.Modal.OKCANCEL,
  42             listeners : {
  43                 btnclick : function (name, e) {
  44                     if(name == 'cancel'){
  45                         _this.loginModal.hide();
  46                     }
  47
  48                     Roo.log(name);
  49                 },
  50                 render : function (_self) {
  51                     _this.loginModal = _self;
  52                 }
  53             },
  54             items : [
  55
  56                 {
  57                     xtype: 'Container',
  58                     xns: Roo.bootstrap,
  59                     well : 'md',
  60                     style : 'margin-top:20px',
  61                     items : [
  62                         {
  63                             xtype: 'Form',
  64                             xns: Roo.bootstrap,
  65                             listeners : {
  66                                 actioncomplete : function (_self, action) {
  67                                     if (action.type =='submit') {
  68                                         _this.loginModal.hide();
  69                                     }
  70                                 }
  71                             },
  72                             items : [
  73                                 {
  74                                     xtype: 'Input',
  75                                     xns: Roo.bootstrap,
  76                                     fieldLabel : 'Email',
  77                                     inputType : 'email',
  78                                     vtype : 'email'
  79                                 },
  80                                 {
  81                                     xtype: 'Input',
  82                                     xns: Roo.bootstrap,
  83                                     fieldLabel : 'Password',
  84                                     inputType : 'password'
  85                                 }
  86                             ]
  87                         }
  88                     ]
  89                 }
  90             ]
  91         });
  92     }
  93 });