Fix #5622 - fix roojs dynamic example
[roojs1] / examples / form / dynamic.js
index 0289389..0534df9 100644 (file)
@@ -11,7 +11,8 @@
  
 var mform;
 var simple;
-\r
+var signature;
+
 Roo.onReady(function(){
 
     Roo.QuickTips.init();
@@ -40,11 +41,19 @@ Roo.onReady(function(){
             width:175
         }),
 
+        
+        
         new Roo.form.TextField({
             fieldLabel: 'Company',
             name: 'company',
             width:175
         }),
+        new Roo.form.TextField({
+            fieldLabel: 'Password',
+            name: 'pwd',
+            inputType: 'password',
+            width:175
+        }),
 
         new Roo.form.TextField({
             fieldLabel: 'Email',
@@ -52,7 +61,7 @@ Roo.onReady(function(){
             vtype:'email',
             width:175
         }),
-         new Roo.form.DayPicker({
+        new Roo.form.DayPicker({
             fieldLabel: 'Pick a day',
             name: 'daypick',
             width:175
@@ -236,9 +245,43 @@ Roo.onReady(function(){
                         name: 'email',
                         vtype:'email',
                         width:225
+                    },
+                    
+                    {
+                        xtype : 'Select',
+                        fieldLabel: 'Country',
+                        name: 'scountry',
+                        //vtype:'email',
+                        width:225,
+                        valueField :'code',
+                        displayField  : 'title',
+                        emptyText : 'Select a country',
+                        store: {
+                             xtype : 'Store',
+                             xns: Roo.data,
+                             
+                             proxy: {
+                                 xns : Roo.data,
+                                 xtype : 'HttpProxy',
+                                 url: 'sample.data.json'
+                             },
+                             reader: {
+                                 xns : Roo.data,
+                                 xtype : 'JsonReader',
+                                 root: 'data',
+                                 totalProperty: 'totalCount',
+                                 id: 'post_id',
+                                 fields : [
+                                     'code', 'title'
+                                 ]
+                             }
+                         },
                     }
                 ]
-            },  
+            },
+            
+            
+            
             {
                   
                 xtype : 'Column', 
@@ -251,7 +294,8 @@ Roo.onReady(function(){
                         fieldLabel:'Biography',
                         width:550,
                         height:200,
-                        resizable: 's' /// where the handles should got..
+                        resizable: 's', /// where the handles should got..
+                        toolbars : [ 'ToolbarStandard', 'ToolbarContext' ]  
                     }
                 ]
             }
@@ -261,7 +305,7 @@ Roo.onReady(function(){
     mform.addButton('Save');
     mform.addButton('Cancel');
 
-   
+   /*
     mform.render('form-ct2');
     mform.setValues({
         country  : 'AK,LA',
@@ -269,6 +313,7 @@ Roo.onReady(function(){
         countrylist  : 'AG,AZ',
         countrylist_names : 'Antigua and Barbuda,Azerbaijan'        
     });
+    */
     /*
      * ================  Form 3  =======================
      */
@@ -325,6 +370,12 @@ Roo.onReady(function(){
             name: 'dob',
             width:190,
             allowBlank:false
+        }),
+        new Roo.form.MonthField({
+            fieldLabel: 'Date of Month',
+            name: 'dom',
+            width:190,
+            allowBlank:false
         })
     );
 
@@ -457,6 +508,39 @@ Roo.onReady(function(){
         labelAlign: 'left',
         labelWidth: 120,
         items : [
+            {
+            
+                xtype: 'Checkbox',
+                xns : Roo.form,
+                fieldLabel: 'A checkbox',
+                boxLabel:'RooJS v1.1.1',
+                name:'extuser',
+                inputValue : '1',
+                value : '1',
+                width:'auto'
+            },
+            
+            {
+            
+                xtype: 'Radio',
+                xns : Roo.form,
+                fieldLabel: 'A test radio box',
+                boxLabel:'Test1',
+                name:'radiotest',
+                inputValue : '1',
+                width:'auto'
+            },
+              {
+            
+                xtype: 'Radio',
+                xns : Roo.form,
+                fieldLabel: 'A test radio box2',
+                boxLabel:'Test1',
+                name:'radiotest',
+                inputValue : '2',
+                checked: true,
+                width:'auto'
+            },
             {
             
                 xtype: 'Checkbox',
@@ -468,6 +552,8 @@ Roo.onReady(function(){
                 value : '1',
                 width:'auto'
             },
+            
+            
             {
                 xtype : 'DisplayField',
                 xns : Roo.form,
@@ -512,24 +598,61 @@ Roo.onReady(function(){
     form5.render('form-ct5');
  
     
-    form6 = new Roo.form.Form({
-        labelAlign: 'left',
-        labelWidth: 120,
-        items : [
-            {
-            
-                xtype: Roo.ux.TimePicker,
-                //xns : Roo.ux,
-                fieldLabel: 'test time picker'
-                
-            }
-             
-        
-        ]
+//    form6 = new Roo.form.Form({
+//        labelAlign: 'left',
+//        labelWidth: 120,
+//        items : [
+//            {
+//            
+//                xtype: 'TimePicker',
+//                xns : Roo.form,
+//                fieldLabel: 'test time picker',
+//                name: 'time'
+//            },
+//            {
+//                xtype: 'DateDisplay',
+//                xns : Roo.form,
+//                fieldLabel: 'test date picker',
+//                name: 'date'
+//            }
+//             
+//        
+//        ]
+//    });
+//    
+//    form6.render('form-ct6');
+    
+    
+    
+    /*
+     * ================ form 7 =======================
+     */
+    signature = new Roo.form.Form({
+        labelWidth: 75, // label settings here cascade unless overridden
+        url:'save-form.php',
+        width: 500
     });
+    signature.add(
+        new Roo.form.Signature({
+            fieldLabel: 'Signature',
+            name: 's',
+            listeners : {
+                confirm : function (_self)
+                {
+                    Roo.log(_self.getImageDataURI());
+                    Roo.log('in confirm');
+                }
+            },
+            width: 300
+        })
+    );
+//
+//    form7.addButton('Save');
+//    form7.addButton('Cancel');
+
+    signature.render('form-ct7');
+    
     
-    form6.render('form-ct6');