Re: work with datepicker

26 views
Skip to first unread message

Jack Lee

unread,
Dec 20, 2012, 7:52:15 PM12/20/12
to li...@googlegroups.com

Hi there,

I don't understand why you do that, maybe the ComboInput will help you.

------------------------------------------------------------------------
Class('App', 'linb.Com',{
    // Ensure that all the value of "key/value pair" does not refer to external variables
    Instance:{
        // To initialize internal components (mostly UI controls)
        // *** If you're not a skilled, dont modify this function manually ***
        iniComponents : function(){
            // [[code created by jsLinb UI Builder
            var host=this, children=[], append=function(child){children.push(child.get(0))};
            
            append(
                (new linb.UI.Input)
                .setHost(host,"ctl_input11")
                .setLeft(110)
                .setTop(100)
                .setLabelCaption("ctl_input11")
                .onFocus("_ctl_input11_onfocus")
            );
            
            append(
                (new linb.UI.SButton)
                .setHost(host,"ctl_sbutton16")
                .setLeft(230)
                .setTop(100)
                .setWidth(36)
                .setCaption("ctl_sbutton16")
                .onClick("_ctl_sbutton16_onclick")
            );
            
            append(
                (new linb.UI.ComboInput)
                .setHost(host,"ctl_comboinput2")
                .setLeft(110)
                .setTop(130)
                .setWidth(150)
                .setLabelCaption("ctl_comboinput2")
                .setType("date")
                .setInputReadonly(true)
            );
            
            return children;
            // ]]code created by jsLinb UI Builder
        },
        // This instance's events
        events : {"beforeCreated":"_com_beforecreated"},
        _datepicker:function(parent,formatdate,object){
            var objDate=new linb.UI.DatePicker();

            objDate.setDateInputFormat(formatdate);
            
            objDate.onChange(function(profile,oldValue,newValue){
               object.setUIValue( linb.Date.format(newValue,"yyyy-mm-dd"));
                _.asyRun(function(profile){                     
                    objDate.destroy();
                })
            });
            
            objDate.render();
            
            //pop
            var node=objDate.getRoot();
            node.popToTop(parent.getRoot());
            //for on blur disappear
            node.setBlurTrigger(objDate.get(0).key+":"+objDate.get(0).$linbid, function(){
                _.asyRun(function(profile){                     
                    objDate.destroy();
                })
            });        
        },
        _ctl_sbutton16_onclick : function (profile,e,src,value){
            var ns = this, uictrl = profile.boxing();
            SPA._datepicker(profile,"yyyy-mm-dd",ns.ctl_input11);
            
        },
        _com_beforecreated : function (com,threadid){
            SPA=this;
        }

    }
});

------------------------------------------------------------------------


On Friday, December 21, 2012 2:21:07 AM UTC+8, sam zr wrote:

i try to work with datepicker ... it show behind other ui unless i change the tabindex ...
is there anyway so it alway show as top ( like modal form ) ?

here is the js  file :


// The default code is a com class (inherited from linb.Com)
Class('App', 'linb.Com',{
    // Ensure that all the value of "key/value pair" does not refer to external variables
    Instance:{
        // To initialize instance(e.g. properties)
        initialize : function(){
            // To determine whether or not the com will be destroyed, when the first UI control be destroyed
            this.autoDestroy = true;
            // To initialize properties
            this.properties = {};
        },
        // To initialize internal components (mostly UI controls)
        // *** If you're not a skilled, dont modify this function manually ***
        iniComponents : function(){
            // [[code created by jsLinb UI Builder
            var host=this, children=[], append=function(child){children.push(child.get(0))};
            
            append(
                (new linb.UI.Input)
                .setHost(host,"ctl_input11")
                .setLeft(110)
                .setTop(100)
                .setLabelCaption("ctl_input11")
                .onFocus("_ctl_input11_onfocus")
            );
            
            append(
                (new linb.UI.Input)
                .setHost(host,"ctl_input22")
                .setLeft(110)
                .setTop(123)
                .setLabelCaption("ctl_input22")
            );
            
            append(
                (new linb.UI.Input)
                .setHost(host,"ctl_input7")
                .setLeft(109)
                .setTop(146)
                .setWidth(160)
                .setLabelCaption("ctl_input22")
            );
            
            append(
                (new linb.UI.SButton)
                .setHost(host,"ctl_sbutton6")
                .setLeft(230)
                .setTop(123)
                .setWidth(36)
                .setCaption("ctl_sbutton16")
                .onClick("_ctl_sbutton6_onclick")
            );
            
            append(
                (new linb.UI.SButton)
                .setHost(host,"ctl_sbutton16")
                .setLeft(230)
                .setTop(100)
                .setWidth(36)
                .setCaption("ctl_sbutton16")
                .onClick("_ctl_sbutton16_onclick")
            );
            
            return children;
            // ]]code created by jsLinb UI Builder
        },
        // Give a chance to load other com
        iniExComs : function(com, threadid){
        },
        // Give a chance to determine which UI controls will be appended to parent container
        customAppend : function(parent, subId, left, top){
            // "return false" will cause all the internal UI controls will be added to the parent panel
            return false;
        },
        // This instance's events
        events : {"beforeCreated":"_com_beforecreated"},
        _datepicker:function(parent,formatdate,object){

            var objDate=new linb.UI.DatePicker({
                position : 'relative',
                Tabindex:100 });
            objDate.setDateInputFormat(formatdate);
            
            objDate.onChange(function(profile,oldValue,newValue){

           object.setUIValue( linb.Date.format(newValue,"yyyy-mm-dd"));
                _.asyRun(function(profile){
                  
                    objDate.destroy();
                })
            
            })
            
           
            
            objDate.show(parent,true);
//              objDate.show(linb('body'));
            
                
            
        },
        _ctl_sbutton1_onclick : function (profile, e, src, value) {
            var uictrl = profile.boxing();
            var ns=this;
            //this.ctl_datepicker1.setVisibility('visible',force);
            var n=new linb.UI.DatePicker();
            n.afterUIValueSet(function(){
            ns.ctl_input1.setUIValue(n.getValue());
            n.setVisibility('hidden');
            })
            n.show(this);
            
               
        },
        _ctl_sbutton16_onclick : function (profile,e,src,value){
            var ns = this, uictrl = profile.boxing();
            
            //SPA._datepicker(profile,"yyyy-mm-dd",ns.ctl_input17);
           
           SPA._datepicker(profile,"yyyy-mm-dd",ns.ctl_input11);
            
        },
        _com_beforecreated : function (com,threadid){
            
            SPA=this;
        
        },
        _ctl_sbutton6_onclick : function (profile,e,src,value){
            var ns = this, uictrl = profile.boxing();
                       SPA._datepicker(profile,"yyyy-mm-dd",ns.ctl_input22);
            
        },
        _ctl_input11_onfocus : function (profile){
            var ns = this, uictrl = profile.boxing();
            //SPA._datepicker(profile,"yyyy-mm-dd",ns.ctl_input11);
        }
    }
});

sam zr

unread,
Jan 24, 2013, 10:01:21 PM1/24/13
to li...@googlegroups.com
ok..i forget if there is combo input format , thaks a lot
Reply all
Reply to author
Forward
0 new messages