...

View Full Version : setAttribute not working



syg6
08-05-2006, 12:57 PM
Howdy coders,

Anyone know why this does not work in Firefox?

var el = document.createElement('input');
el.setAttribute('onfocus', function() {this.blur()});

It works in IE6. Can this work in Firefox? I've tried putting quotes around 'function()' and that doesn't work either ...

Bill Posters
08-05-2006, 01:29 PM
I don't know why that wouldn't work, but…

You should be aware that using such a script kills the usability for keyboard users. Keyboard users alight on an element (focussing) before they actually use it (activate it). If the onfocus event is telling the browser to reject the focus, then keyboard users have no way of using that input - or any other element which uses js to reject the focus.

I guess you're doing it to avoid the 'focus border' which some browsers implement around the focussed element. I too used to be like that, and used to implement that kind of script for links. However, since becoming aware of the consequences for keyboard users, I now only ever consider using js to reject the focus on the very rarest of occasions.

Something to consider. ;)

glenngv
08-06-2006, 05:32 AM
FWIW, this is the cross-browser solution:

var el = document.createElement('input');
el.onfocus = function() {this.blur();};
But I agree with Bill, that will make the field inaccessible even using a mouse. If you explain what your ultimate reason of doing this, maybe we can suggest a better alternative for it.

Bill Posters
08-06-2006, 09:27 PM
FWIW, this is the cross-browser solution:

var el = document.createElement('input');
el.onfocus = function() {this.blur();};
I was going to suggest that too, but a quick check turned out to be equally ineffective in FF/Mac.
Aside from not actually working, it threw an error which Firebug listed as follows…

[Exception... "'Permission denied to set property XULElement.selectedIndex' when calling method: [nsIAutoCompletePopup::selectedIndex]" nsresult: "0x8057001e (NS_ERROR_XPC_JS_THREW_STRING)" location: "JS frame :: file://localhost/Users/bill/Desktop/test.html :: anonymous :: line 22" data: no]

Tbh, that goes straight over my head.

Fwiw…
The test doc used XHTML 1.0 Strict served as text/html.
The same error was returned using HTML 4.01 Strict as text/html.

glenngv
08-07-2006, 01:48 AM
I was going to suggest that too, but a quick check turned out to be equally ineffective in FF/Mac.
Aside from not actually working, it threw an error which Firebug listed as follows…


Tbh, that goes straight over my head.

Fwiw…
The test doc used XHTML 1.0 Strict served as text/html.
The same error was returned using HTML 4.01 Strict as text/html.
I think that's a bug in FF. It can be "fixed" by turning autocomplete to off.

var el = document.createElement('input');
el.setAttribute("autocomplete", "off");
el.onfocus = function() {this.blur();};

syg6
08-09-2006, 12:17 PM
Hello again. Sorry for the delay.

I tried all of the solutions mentioned above and none seem to work in FF1.5 for WinXp. I don't get an error or anything, it just does nothing.

Incidentally, I am not trying to use blur() just so the focus border isn't visible. This is an admin panel that's going to be used by exactly one person who has almost no idea of web. The field in question is of type FILE. Thus I don't want her futzing around, trying to enter text in the input, I want to force her to click on the Browse button. Otherwise she might try typing it by hand.

And since she is such a novice I doubt very much she'll be keyboard-navigating. She's a very mouse-oriented person.

So I agree with what you are all saying in terms of usability, but in this case it's no big whoop.

But regardless, I can't get it to work so ...

Thanks for all your tips!
BOb

glenngv
08-09-2006, 10:32 PM
If you make File input field readonly or blur onfocus, it would make the Browse button (which is also part of the field) unusable. That's what happens in IE, but in Firefox, this has no effect. It's good this doesn't take effect as File input field is a not a normal field like textbox. Why not just validate the file path in the server-side?

You can actually use onkeydown to disallow typing but that will not fully stop the user to manually enter the path. There's the Copy-Paste operation. And you even said that the user is mouse-oriented, so most or all of the time, the user will click Browse instead of typing.

If I were you, I will just validate the path on the server. I assume you're using a file upload script and it must have file path validation in it.

arianhojat
08-29-2006, 06:05 PM
hmm ive always had trouble with setattribute and event handlers...
i think setAttribute is looking for a string not a function as you suggested (but still couldnt get to work), and in that string if 'this' is mentioned, it doesnt know what 'this' is.
so you have to set it with event handler which takes on a function and in that fucntion you can refer to 'this' and it will know what to look at(i think).

maybe change

el.setAttribute('onfocus', function() {this.blur()});
to
el.onfocus = function temp(){ this.blur();};

zcorpan
08-29-2006, 07:07 PM
I think the second parameter of setAttribute should be a string, so:
elm.setAttribute("onfocus", "this.blur()");But I don't understand why you would want to use setAttribute for this when it's simpler to just use .onfocus. Furthermore, I don't see the point in this script at all. Is the intent to break keyboard navigation or what?



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum