1. #1
    Sencha User
    Join Date
    Apr 2013
    Posts
    2
    Vote Rating
    0
    fabiand is on a distinguished road

      0  

    Default ExtJS 4.2 apply DateField to input form field

    ExtJS 4.2 apply DateField to input form field


    I am trying to convert my application from 3.1 to 4.2 and can't seem to figure out what needs to be modified in place of the 'applyto'. I have tried variations of renderto and contentel but can't seem to figure it out. With 4.2 nothing seems to happen. No errors in firebug...
    Ext 3.1 code that works-
    Javascript file -
    Code:
     cust_datepicker=function(){
     var els=Ext.select("input.date-picker",true);
     els.each(function(el)
      {
       new Ext.form.DateField(
       {applyto: el.id
       ,format: 'Y-m-d'
       ,altFormats: 'j|j/n|j/n/y|j/n/Y|j-M|j-M-y|j-M-Y'
       ,editable: false
       ,id : el.id
       }
      );
     }
    )};
    Ext.onReady(function(){
      cust_datepicker();
    });
    HTML Code:
    <form action="xxx/xxx.cgi" method="GET">
    <table><tr>
    <td><input name="startdate" class="date-picker"/></td>
    </tr></table>
    </form>

  2. #2
    Sencha User
    Join Date
    Apr 2013
    Posts
    2
    Vote Rating
    0
    fabiand is on a distinguished road

      0  

    Default Hint please

    Hint please


    I will accept a hint... right now I am taking the shotgun approach and I have probably overlooked the resolution.

  3. #3
    Sencha User
    Join Date
    Apr 2013
    Posts
    14
    Vote Rating
    3
    billvs is on a distinguished road

      0  

    Default


    i have the same problem,
    does extjs4 has any way to figure out this?

  4. #4
    Sencha User
    Join Date
    Sep 2013
    Posts
    14
    Vote Rating
    1
    trenty is on a distinguished road

      0  

    Default


    Same problem here for ExtJS 4.2. Changing applyTo to renderTo doesn't help.

    How to apply DateField to an existing input?

  5. #5
    Sencha User
    Join Date
    Sep 2013
    Posts
    14
    Vote Rating
    1
    trenty is on a distinguished road

      1  

    Default


    A look into Ext JS 3 -> 4 Compatibility Layer helps a bit:

    renderTo: Ext.get('inputId').parent() // + Ext.get('inputId').remove() later...

    Excerpt from ext3-compat.js
    Code:
    Ext.apply(Ext.Component.prototype, {
                initComponent: Ext.Function.createInterceptor(Ext.Component.prototype.initComponent, function() {
                    if(Ext.isDefined(this.applyTo)){
                        deprecate({pkg:'Ext.Component', member:'applyTo', type:'config', alt:'renderTo',
                            msg:'Applying components to existing markup via "applyTo" is no longer supported.'});
                        
                        var replaced = false;
                        try{
                            var target = Ext.get(this.applyTo);
                            if (target) {
                                var parent = target.parent();
                                if (parent) {
                                    this.renderTo = parent;
                                    target.remove();
                                    replaced = true;
                                    notify({pkg:'Ext.Component', member:'applyTo', msg:'This component will attempt to render to '+
                                        'the applyTo target\'s parent node ("' + parent.id + '"). If this did not work as expected then '+
                                        'you will have to replace the applyTo config manually before this component will render properly.'})
                                }
                            }
                        } catch(ex) {}
                        
                        if (!replaced) {
                            breaking({pkg:'Ext.Component', member:'applyTo', msg:'Attempted to render the component to the applyTo target\'s '+
                                'parent node, but this failed. You must resolve this manually before the component can render.'})
                        }
                    }
                })
            });

  6. #6
    Sencha User
    Join Date
    Jul 2012
    Location
    france
    Posts
    2
    Vote Rating
    0
    Vickb is on a distinguished road

      0  

    Default


    Here something that worked for me with ExtJS 4.2.0.
    The solution is to create a Form containing a Field.
    HTML :

    HTML Code:
    <table>
      <tr>
        <td><div id="here"></div</td>
      </tr>
    </table>
    Javascript:
    Code:
    var here = document.getElementById('here');
    var my_form = Ext.create('Ext.form.Panel', {
            renderTo: here,
            bodyStyle: 'border: none',
            items: [{
                xtype: 'datefield',
                margin: false,
                name: 'from_date'
            }]
        });

Thread Participants: 3

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