1. #1
    Ext User gmoney's Avatar
    Join Date
    Mar 2007
    Posts
    42
    Vote Rating
    0
    gmoney is on a distinguished road

      0  

    Default Complex Forms in 2.0

    Complex Forms in 2.0


    It seems that forms were so much easier to create before 2.0. Maybe I am just not used to the new syntax. Can someone help get this form to work in 2.0?

    Old way:
    Code:
        var setupContactForm = function() {
            contactForm = new Ext.form.Form({
                labelAlign: "right"
            });
            
            //### start General Information fieldset
            contactForm.fieldset({legend: 'General Information'});
            
            contactForm.container({ width: 800 });
            contactForm.column({width: 300, labelWidth: 75},
                new Ext.form.ComboBox({
                    fieldLabel: 'Salutation',
                    hiddenName: 'salutation',
                    store: new Ext.data.SimpleStore({
                        fields: ['salutation_id', 'salutation_name'],
                        data : createContactLocale.salutation
                    }),
                    displayField: 'salutation_name',
                    valueField: 'salutation_id',
                    typeAhead: true,
                    mode: 'local',
                    triggerAction: 'all',
                    selectOnFocus: true,
                    editable: false,
                    width: 100
                }), new Ext.form.TextField({
                    fieldLabel: 'First Name',
                    name: 'firstName',
                    allowBlank: false,
                    width: 150
                }), new Ext.form.TextField({
                    fieldLabel: 'Last Name',
                    name: 'lastName',
                    width: 150
                }), new Ext.form.TextField({
                    fieldLabel: 'Nickname',
                    name: 'nickname',
                    width: 150
                }), new Ext.form.TextField({
                    fieldLabel: 'Alias Name',
                    name: 'aliasName',
                    width: 150
                })
            );
            contactForm.column({id: 'photo', width: 250, style:'margin-left:10px'});
            contactForm.end();
            contactForm.end();
            
            //$$$Start gender, birthday, education container
            contactForm.container({ width: 800 });
            contactForm.column({width: 150, labelWidth: 75},
                new Ext.form.ComboBox({
                    fieldLabel: 'Gender',
                    hiddenName: 'gender',
                    store: new Ext.data.SimpleStore({
                        fields: ['gender_id', 'gender_name'],
                        data : createContactLocale.gender
                    }),
                    displayField: 'gender_name',
                    valueField: 'gender_id',
                    typeAhead: true,
                    mode: 'local',
                    triggerAction: 'all',
                    selectOnFocus: true,
                    editable: false,
                    width: 70
                })
            );
            contactForm.column({width: 185, labelWidth: 75, style: 'margin-left: 50px;'},
                new Ext.form.DateField({
                    fieldLabel: 'Date of Birth',
                    name: 'birthday',
                    width: 100,
                    format:'Y-m-d'
                })
            );
            contactForm.column({width: 250, labelWidth: 75, style: 'margin-left: 10px;'},
                new Ext.form.ComboBox({
                    fieldLabel: 'Education',
                    hiddenName: 'education',
                    store: new Ext.data.SimpleStore({
                        fields: ['education_id', 'education_name'],
                        data : createContactLocale.education
                    }),
                    displayField: 'education_name',
                    valueField: 'education_id',
                    typeAhead: true,
                    mode: 'local',
                    triggerAction: 'all',
                    selectOnFocus: true,
                    editable: false,
                    width: 165
                })
            );
            //contactForm.end();
            //$$$End gender, birthday, education container
            contactForm.end();
            //$$$Startcompany, department, job title container
            contactForm.container({ width: 800 });
            contactForm.column({width: 200, labelWidth: 75},
                new Ext.form.TextField({
                    fieldLabel: 'Job Title',
                    name: 'jobTitle',
                    width: 100
                })
            );
            contactForm.column({width: 195, labelWidth: 75},
                new Ext.form.TextField({
                    fieldLabel: 'Department',
                    name: 'department',
                    width: 100
                })
            );
            contactForm.column({width: 250, labelWidth: 75},
                new Ext.form.TextField({
                    fieldLabel: 'Company',
                    name: 'Company',
                    width: 165
                })
            );
            //$$$End company, department, job title container
            contactForm.end();
            //###End General Information fieldset
            
            contactForm.render('form-contact');
    
            var photo = Ext.get('photo');
            var photoImg = photo.createChild({
                tag: 'center',
                cn: {
                    tag: 'img',
                    src: '../../resources/images/photo/photo.jpg',
                    style: 'margin-bottom: 5px;'
                }
            });
            new Ext.Button(photoImg, {
                text: 'Change Photo'
            });
        };
        
        return {
            init: function() {
                Ext.QuickTips.init();
                // turn on validation errors beside the field globally
                Ext.form.Field.prototype.msgTarget = 'side';
                
                setupContactForm();
            }
        }
    }());
    
    Ext.EventManager.onDocumentReady(createContact.init, createContact, true);
    Attached Images

  2. #2
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,501
    Vote Rating
    47
    Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    So, are you even attempting to debug it? I mean does Firebug show you any errors in your code? Firebug?

  3. #3
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,501
    Vote Rating
    47
    Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    And did you read any of the example code in examples/form? At all?

    Or any of the documentation?

    Or the (draft, because it's in beta test) Ext 2.0 upgrade guide?

  4. #4
    Ext User gmoney's Avatar
    Join Date
    Mar 2007
    Posts
    42
    Vote Rating
    0
    gmoney is on a distinguished road

      0  

    Default


    Thanks for the reply. Sorry for being to general. I will read through those docs and come back with specific questions.

  5. #5
    Sencha User
    Join Date
    Apr 2012
    Location
    Austin, Texas
    Posts
    2
    Vote Rating
    0
    brian.moeskau is an unknown quantity at this point

      0  

    Default


    Please see the forms section in the upgrade guide:

    http://extjs.com/learn/Ext_1_to_2_Mi..._Forms_for_2.0

    If it is missing anything that you need, please let me know.

Thread Participants: 2

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi