Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > Javascript > Input Field Focus ()

Reply
Thread Tools

Input Field Focus ()

 
 
FormLess
Guest
Posts: n/a
 
      04-27-2007
I'm using JS to dynamically change the CSS attrib's of User Input Fields in
a form.

It works fine for text input fields but does not seem to work at all for
TEXTAREAS. (IE6)

Is there a tweak that might overcome this limitation?

Here's the juice:

====================== ext js file =========

sfFocus = function() {
var sfEls = document.getElementsByTagName
("INPUT");
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onfocus=function() {
this.className+=" sffocus";
}
sfEls[i].onblur=function() {
this.className=this.className.replace
(new RegExp(" sffocus\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent
("onload", sfFocus);

======================== ext. css ===========
input:focus, textarea:focus {
background: #cfc;
border-color: #090;
}
input.sffocus, textarea.sffocus {
background: #cfc;
border-color: #090;
}

=======================================

the TEXTAREA and INPUT fields have names, id's and default formatting
classes applied to them. Oddly enough, in both OPERA & FF, the TEXTAREA
DOES change color properly with focus applied. IE6 is the only one where it
does not work.

thanks for any assistance on this.


 
Reply With Quote
 
 
 
 
Peter Michaux
Guest
Posts: n/a
 
      04-27-2007
On Apr 26, 8:07 pm, "FormLess" <(E-Mail Removed)> wrote:
> I'm using JS to dynamically change the CSS attrib's of User Input Fields in
> a form.
>
> It works fine for text input fields but does not seem to work at all for
> TEXTAREAS. (IE6)
>
> Is there a tweak that might overcome this limitation?
>
> Here's the juice:
>
> ====================== ext js file =========
>
> sfFocus = function() {
> var sfEls = document.getElementsByTagName
> ("INPUT");


The above line doesn't find elements with tag name "textarea". So the
handlers below are not added to the textareas.

> for (var i=0; i<sfEls.length; i++) {
> sfEls[i].onfocus=function() {
> this.className+=" sffocus";
> }
> sfEls[i].onblur=function() {
> this.className=this.className.replace
> (new RegExp(" sffocus\\b"), "");
> }
> }
> }
> if (window.attachEvent) window.attachEvent
> ("onload", sfFocus);



attachEvent() is for IE. For DOM2 compliant browsers you want
addEventListener()


Peter

 
Reply With Quote
 
 
 
 
FormLess
Guest
Posts: n/a
 
      04-29-2007

"Peter Michaux" <(E-Mail Removed)> wrote in message
news:(E-Mail Removed) oups.com...
> On Apr 26, 8:07 pm, "FormLess" <(E-Mail Removed)> wrote:
> > I'm using JS to dynamically change the CSS attrib's of User Input Fields

in
> > a form.
> >
> > It works fine for text input fields but does not seem to work at all for
> > TEXTAREAS. (IE6)
> >
> > Is there a tweak that might overcome this limitation?
> >
> > Here's the juice:
> >
> > ====================== ext js file =========
> >
> > sfFocus = function() {
> > var sfEls = document.getElementsByTagName
> > ("INPUT");

>
> The above line doesn't find elements with tag name "textarea". So the
> handlers below are not added to the textareas.
>
> > for (var i=0; i<sfEls.length; i++) {
> > sfEls[i].onfocus=function() {
> > this.className+=" sffocus";
> > }
> > sfEls[i].onblur=function() {
> > this.className=this.className.replace
> > (new RegExp(" sffocus\\b"), "");
> > }
> > }
> > }
> > if (window.attachEvent) window.attachEvent
> > ("onload", sfFocus);

>
>
> attachEvent() is for IE. For DOM2 compliant browsers you want
> addEventListener()
>
>
> Peter
>


Thanks for your feeback, Peter.
I got around the situation by creating a duplicate function (different name)
for TEXTAREAS, obviously substituting TEXTAREA for INPUT.

I tried applying this to a 3rd form element, Radio button groups, but this
logic doesn't seem to work here. Where ("INPUT") governs simple text input
fields, ("RADIO") will not work for Radio groups. I'm working with two
radio groups, one a 2-element group and one a 4-element group.

any help with choosing the right descriptor for this type of form element
would be appreciated...



 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
this.window.focus() vs. window.focus() vs. this.focus() Roger Javascript 3 03-08-2007 08:53 PM
Input field focus after postback - v1.1 Adrian Parker ASP .Net 1 03-10-2006 01:23 PM
how can i catch a lost focus event from an input field inside a form =?ISO-8859-15?Q?Josef_Bl=F6sl?= HTML 1 07-20-2005 10:54 AM
How to focus the cursor in an input field when accessing a site Rune RunnestÝ Javascript 4 05-08-2005 11:50 AM
focus on a input field leiko Javascript 3 02-26-2004 04:20 PM



Advertisments