asked on

javascript focus

Hey all,
Need some help with this.. I would really appreciate any help in this pls..
I have a small javascript

<script language="JavaScript1.2">

if (document.layers)
document.captureEvents(Event.KEYPRESS)
function alert_keycode(){
alert(event.keyCode)
}
document.onkeypress=alert_keycode
</script>
<HEAD>
<form>
<P>INPUT: <INPUT type="button" value = "Check "></P>
<P><input type="text"></P>
</form>
</HTML>
I am using IE 4.0

What I need to do is ---
I want to check in my javascript
if(event.keyCode == 65) (means if we press "a")

I want to change my focus from may be button --- to a Text Field..
so that key "a" works in the same way as "TAB" key ..

I don't want to loop through the elements in the form.. because I will be using the same script in many pages and all pages have different number of elements..

Is there anything like advanceFocus in javascript which can just advance my focus to next element on the page..
I guess browser already knows which element has got a focus .. May be I can use some of that information but I don't know how..

I would really appreciate any help with this..

Best Regards

MHQ

If you want the focus to be set at the texfield "yourinputfield" then do like this:

function alert_keycode(){
document.forms.yourformname.yourinputfield.focus();
}

narrav

ASKER

this I know..
But I want to know how to focus to a next textbox when somebody presses when somebody presses key "a"..

I know how to catch the event for key "a".. BUT How to pass the focus to a next textbox ..
not by just saying
document.forms.yourformname.yourinputfield.focus();

because I want to make some general purpose script which can work in all my html pages .. all my html pages have different forms and different and unique element names...

thats what the problem is..

Regards

MHQ

if you have used some standard while naming the text fields, like callig the key "a" and the field "text_a". Then you can check which button that sends the request, add "text_" to the string and set it as the focus.

jbirk

You could add an onfocus handler to each and every form element which saves a variable identifying which form element got focus last. Then find the next one in the form.elements array and focus on it...

-Josh

kollegov

Tested with NN4.61, MIE5 (WinNt)

<html>
<script language="JavaScript1.2">

if (document.layers)
document.captureEvents(Event.KEYPRESS)
function alert_keycode(k){
if(document.layers) alert(k.which)
if(document.all) alert(event.keyCode)
}
document.onkeypress=alert_keycode
</script>
<HEAD>
<form>
<P>INPUT: <INPUT type="button" value = "Check "></P>
<P><input type="text"></P>
</form>
</HTML>

narrav

ASKER

jbirk .. your idea is cool and seems to be working fine.. Just a little bug is that I am able to get focus to next element but it inserts a tab character in my last element also..

if i have 2 textboxes ---
a and b

I have say right now focus on "a"

I take index of "a" and if somebody
presses tab.. I put my focus to "b"

Before I get a focus of "b", I insert a tab character in "a" .. so I think I just need to delete the last character (which is tab) if somebody presses tab...
How can I do so.. if you can help me with this.. I will really appreciate ..

Best Regards

kollegov

Jbirk's idea is good, but wouldn't work :(
Since one button grabbed focus in NN4 (Win95) you have no chance to receive next keypress event at level of document, button peer will intercept all key events... And thus you can't use keypress to pass focus to next component :(

That's code I used for testing:

<html>
<script language="JavaScript1.2">

if (document.layers) {
document.captureEvents(Event.KEYPRESS)
}
function alert_keycode(k){
var code=-1
if(document.layers) code=k.which;
if(document.all) code=event.keyCode
if(code>=0){
inp = document.f.elements[ String.fromCharCode(code) ];
if(inp!=null){
window.status=inp+""
inp.focus();
}
}
}

document.onkeypress=alert_keycode

</script>
<HEAD>
<form name=f>
<P>Press 'a' to pass focus here: <INPUT type="button" name="a" value = "Check " ></P>
<P>Press 'b' to pass focus here: <input type="text" name="b" ></P>
</form>
<script>

</script>
</HTML>

May be this idea wasn't bad for MIE
but it wouldn't work in NN4 :(

narrav

ASKER

kollegov your is great

But problem is --
If I am in "b" textbox and I press "a" --
It focuses to "a" element but at the same time it takes "a" character inside the "b" textbox..
How I can make it happen so that textbox of "b" doesnt take "a" character and focus moves to "a" element...as soon as somebody presses "a"

Hope you can help me with this..
Regards

narrav

ASKER

oH YEA ..
I just noticed this too..
This will work with some very particular key elements.. as you are checking ...
document.f.elements[ String.fromCharCode(code)

and you have named input box as "a" , "b"..

Well.. we are not naming input box as
"a", "b" or anything..
we are using ECML standard for naming the textbox.. and we don't want to change this..

so I think getting the variable of each element when its losing the focus is a better idea...

Just that I don't know How to take care of this last character which is always getting into my textboxes...

Regards

jbirk

Here is what I was thinking for my idea: tested in IE5 NN4.7

<html>
<script language="JavaScript">

</script>
<HEAD>
<BODY onload="focused_obj=document.f.elements[0];">
<form name=f>
<P>Press 'a' to pass focus to next one:
<P><INPUT type="text" name="a" onFocus="record_focus(this);">
<P><input type="text" name="b" onFocus="record_focus(this);">
</form>
</BODY>
</HTML>

It leaves behind the a character when you press it though, but that's a normal character to be putting into a text field... Do you not want a to appear in the text field?

-Josh

narrav

ASKER

No i don't want the character to appear in the textfield ..
Hope you can help me with this..
by that time I can try to understand your above code...

Thanks alot and regards

narrav

ASKER

Ok got it jbirk..
looks great to me... just that last character problem.. if you can help me with this.. would really be appreciable..

Regards

MHQ

just add this:
if (document.f.elements[i].value){
document.f.elements[i].value = document.f.elements[i].value
}else{
document.f.elements[i].value = ''
}

before you set the focus. Hope that does it. If not, just go with that idea (just popped up in my brain)

narrav

ASKER

sorry MHQ.. doesn't work at all..

I am still hoping Josh has some better idea...

MHQ

you did add the missing ; at the end of the two lines? and take notice that the '' at the second line is two ' s.

MHQ

Ok, you do know that the function you use above will unable the visitor to write the letter "a" in the textbox? He will be forwarded to the next box at once and the letter will appear there...

(i also understand that my script will do no good at all)

narrav

ASKER

Yes I do understand that visitor should be unable to write a letter "a" ..and this letter should not appear on any textbox.. this letter should be used only to transfer focus between textboxes...

Now how to implement it if you can help me with this...

regards

jbirk

Just replace the "break;" line with "return false;" That's all you need. I didn't put it in there because I thought having the 'a' might be important...

-Josh

MHQ

I came up with this solution, but of no use of'course...

....just exchange you code for the function with this:

function record_focus(obj)
{focused_obj=obj;
focused_obj.value='';
}

It works fine for me.

jbirk

MHQ, that change removes all the text from the input field (assuming it is an input field). Even non 'a' characters are removed as well. Also it may cause an error if the input field is not a text field.

-Josh

narrav

ASKER

Josh.. you are right...
:))

ASKER CERTIFIED SOLUTION

jbirk

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial