Ext Core: Display an info text in a HTML input field if its focus is lost

[marcus.schiesser]

You want to do that just by using the new Ext Core 3.0?
Then use the code from this post:
Display an info text in a HTML input field if its focus is lost (http://www.marcusschiesser.de/?p=286)

Have fun,

Marcus

[Joe]

I like the example on the page but had to use SVN to pull it down and then hunt down the .js file. A bit much for the avg person to want to go through to find the code.

Tip: If you can post the code, then you will more likely get responses and even code fixes.

On that note - after reading the code it seemed that if the field contained a value already, it would not function properly and sure enough - it didn't - here is a fix.
I also updated it so you can pass an element a dom or a string id field.

I normally wouldn't post your code here when you didn't in the first place, but in this case it is the best way for me to show you the fixes / enhancements - hope you don't mind.



/**
* @author schiesser
* 6-12-2009 - Bug fixes / enhancement by Joseph Francis
*/

Ext.ns('Extensive.behaviours');

Extensive.behaviours.setInfoText = function(element, infoText, infoClass){
infoClass = infoClass || 'extensive-info-text';
//--- updated to allow and element, dom or text id to be passed
var element = element.dom ? element : Ext.get(element);
//--- set value here using dom to assure it works when it has and does not have a value
var value = element.dom.value;
//--- updated to work properly in the event that the field initially contains a value
if (element.dom.value === '' ){
element.dom.value = infoText;
element.addClass(infoClass);
}
var onBlur = function(e){
value = e.target.value;
if (value === '') {
e.target.value = infoText;
Ext.fly(e.target).addClass(infoClass);
}
};

var onFocus = function(e){
Ext.fly(e.target).removeClass(infoClass);
if (value === '') {
e.target.value = '';
}
};
element.on('focus', onFocus);
element.on('blur', onBlur);
};

[marcus.schiesser]

Hi Joe,

thanks for the fix. Do you want to commit it to SVN? If so I would be glad to give you access. Just send me mail (e.g. at http://www.marcusschiesser.de/?page_id=54) with you e-mail.
About the code thing: I don't want to include too much code in my posts but next time I can at least include a link.

Thanks,

Marcus

[Joe]

Have you seen / used this?

http://www.extjs.com/forum/showthread.php?t=43450
I am setup as an author here and can help you do the same and/or post your ux controls here as well. This is a nice central place for common ux controls.

Thanks for your contributions - I sent you my contact info re SVN access.

[Joe]

Per our e-mails .. this code has been updated on your SVN at:http://code.google.com/p/extensive

Also it has been added to the ExtJS Core Open Source Content Controls library
http://code.google.com/p/extjscoremitux

Thanks!