1. #1
    Sencha User
    Join Date
    Oct 2011
    Location
    Berkley, MI
    Posts
    21
    Answers
    2
    Vote Rating
    1
    ghawazigirl is on a distinguished road

      0  

    Default Answered: Sencha Touch 2.1 Problem with DatePicker

    Answered: Sencha Touch 2.1 Problem with DatePicker


    I just upgraded my application to use Sencha Touch 2.1. I've been able to get almost everything working the same as with ST 2.0.1, but I am having trouble with Ext.field.DatePicker. When I click on the date picker field, the box opens full size, but the picker is only about 1 pixel wide.

    Here is my form code:
    Code:
    var curDate = new Date();
    var year = curDate.getFullYear();
    Ext.define("dcwtouch.view.LeadEntryParentForm", {
        extend: 'Ext.form.Panel',
        requires: ['Ext.field.Select', 'Ext.field.DatePicker'],
        xtype: 'leadEntryParentForm',
        
        config: {
            id: 'leadEntryParentForm',
            record: 'dcwtouch.model.LeadModel',
            height: window.innerHeight-145,
            
            items: [
                {
                    xtype: 'fieldset',
                    id: 'parent-fieldset',
                    title: 'Lead Entry - Parent Information',
                    defaults: {
                        required: true,
                        labelWidth: '35%'
                    },
                    items: [
                        {
                            //... various form fields
                        },{
                            xtype: 'datepickerfield',
                            name: 'birthDate',
                            label: 'Birthday',
                            id: 'birthday2',
                            value: 'birthDate',
                            required: true,
                            picker: {
                                cancelButton: 'Clear',
                                yearFrom: 1994, 
                                yearTo: year+1
                            }
                        }
                    ]
                },{    
                    xtype: 'button',
                    text: 'Continue',
                    margin: '0 50 0 50',
                    ui: 'confirm',
                    action: 'parentContinue'
                } 
            ],
        }
    });
    Here is an image of what I see when I try to pick a date:
    DatePicker.jpg

    Any assistance will be much appreciated. Thanks.


    UPDATE: I get the above result when I test on my desktop using Chrome. When I test using Safari, I do not even get the 1 pixel-wide picker, just the background and title bar with the buttons. I get this same result when I tested my app on my android tablet.

  2. I got it working. mitchellsimoens comment about DatePicker working with the default CSS made me review the SCSS file that I had updated for my application. My '@include sencha-picker;' statement was in a different location further down the list than in the 2.1 SCSS file. When I moved it up to match the same order as with ST 2.1, the DatePicker displayed properly. I figured that I had made some simple, but easily overlooked, error and I was right.

  3. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,782
    Answers
    3465
    Vote Rating
    833
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    It's working fine for me in Chrome, Safari and iOS 6 in 2.1.0 and with default CSS
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  4. #3
    Sencha User
    Join Date
    Feb 2011
    Location
    Düsseldorf, Germany
    Posts
    573
    Answers
    34
    Vote Rating
    31
    Kurt001 has a spectacular aura about Kurt001 has a spectacular aura about

      0  

    Default


    Most likely the parent container of the datePicker does not come with a width of 100%.
    Check out in Chrome what happens if you set the width of the picker manually to 300px.
    Then test the parent containers until you get the desired result.

  5. #4
    Sencha User
    Join Date
    Oct 2011
    Location
    Berkley, MI
    Posts
    21
    Answers
    2
    Vote Rating
    1
    ghawazigirl is on a distinguished road

      0  

    Default


    I got it working. mitchellsimoens comment about DatePicker working with the default CSS made me review the SCSS file that I had updated for my application. My '@include sencha-picker;' statement was in a different location further down the list than in the 2.1 SCSS file. When I moved it up to match the same order as with ST 2.1, the DatePicker displayed properly. I figured that I had made some simple, but easily overlooked, error and I was right.

Thread Participants: 2

Tags for this Thread

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