PDA

View Full Version : DateField hiddenTrigger Show Picker on Focus



ValterBorges
11 Aug 2009, 9:40 AM
Hi,

I have a form that has various fields next to each other and there no space for the trigger on a datefield. I'm able to simulate clicking on the trigger by using a listener on focus.

The relevant parts of the datefield config.


hideTrigger:true,
listeners:{
focus: function(){
this.onTriggerClick();
}


Now I want to also show the picker if the user clicks in the field after focus. I've tried using the same approach as the focus but it doesn't work. So far i've tried (click,dblclick,mouseenter) no luck!.

Can someone shed some light on this.

Thanks
Valter

Animal
11 Aug 2009, 9:43 AM
Add a click listener to the Field's Element

This keeps coming up!

ValterBorges
11 Aug 2009, 10:30 AM
Thank you much.

Here is how I did it. Is this the best way to write this?



DateField.getEl().on('click',function(evt,el,o){DateField.onTriggerClick();});




Also is there a way to make it so if the user starts typing it will allow them without having to press esc and make the datepicker disappear?

Animal
11 Aug 2009, 10:37 AM
Call focus on the DateField immediately after onTriggerClick()

ValterBorges
11 Aug 2009, 10:54 AM
Hi Animal,
Thanks for being patient.

Here is what i tried but the focus still remains on the menu.


DateField.getEl().on('click',function(evt,el,o){
DateField.onTriggerClick();
DateField.focus();
});

Do i need to attach to one of the menu render functions for this to work?

ValterBorges
11 Aug 2009, 11:17 AM
By the way this works great on comboboxes.



ComboBox.getEl().on('click',function(evt,el,o){
ComboBox.onTriggerClick();
});

Animal
11 Aug 2009, 11:58 AM
Try delaying it using the delay parameter of the focus method.

ValterBorges
11 Aug 2009, 2:14 PM
Hi Animal,

That seems to work for the click event have to set delay to at least 50 otherwise it doesn't work.


DateField.getEl().on('click',function(evt,el,o){
DateField.onTriggerClick();
DateField.getEl().focus(100);

});

This works swell for click but if a user is tabbing and i also set the focus event as such:



//Note that i don't use getEl for the onfocus otherwise endless loop.
DateField.on('focus',function(evt,el,o){
DateField.onTriggerClick();
DateField.getEl().focus(100);

});

then the datemenu stays up all the time and it won't allow me to click to another field or when i tab to another field the menu is still up.

How would i hide the menu onBlur?