All about Chris Huber

Focus for an html array input

And now I just realized that my method will clear any data entered each time a field is added. I need to come up with another way.

15 years ago

HTML Pages with CSS and JavaScript

Focus for an html array input

Getting very close... I am using a counter and reference it with:
document.inputform.elements["documents[]"][counter].focus();

Focus works the first time it adds a field in IE8, but when you add a third, forth, etc. field the focus doesn't change (just goes away). I don't get a JavaScript error.

It works every time in Firefox.

15 years ago

HTML Pages with CSS and JavaScript

Focus for an html array input

I don't know where to begin on traversing multiple elements with the same name.

The jQuery does look trivial - but keep in mind that the value would be blank... so I assume I would tell it to focus on a value that is blank, which doesn't sound like a good idea.

15 years ago

HTML Pages with CSS and JavaScript

Focus for an html array input

There is such a thing as an array on an html form... simply use <input type='text' value='Apples' name='fruit[]'> and <input type='text' value='Oranges' name='fruit[]'> and on the server side you can retrieve the value of fruit as an array. How would you set the focus on the second field (Oranges) using focus()?

15 years ago

HTML Pages with CSS and JavaScript

Focus for an html array input

I have an entry form that is dynamic (any number of items can be added.) The user clicks a button to add another entry. The html form field is an array. It works perfectly except I can not figure out how to change the focus through javascript.

My question is, what would be a way to change focus on an input that has is being built dynamically and has the same name? I want the latest created field to have the focus.

15 years ago

HTML Pages with CSS and JavaScript

Hiding a popup span with onblur

I solved it by nesting the popup within the span.

15 years ago

HTML Pages with CSS and JavaScript

Hiding a popup span with onblur

I have a popup that is similar to a 'google suggest' where it creates a drop-down based on the text after each onkeyup... There will be multiple fields like this on a page.

I'm struggling with hiding the popup if the user clicks outside the input box or tabs to the next field. I really want to use onblur, which seems to be designed exactly for this - except when I use it, it hides the popup when you click on a selection in the popup box - prior to it executing the script to put the value in the input box. If it could execute the clicked on action, then hide the box, it would work perfectly.

I'm trying to avoid using the 'find the mouse cursor click and determine if it is inside or outside the popup...' method. With that method I also have to take into account if they tab outside the input box.

Any suggestions?

Here is the slimmed down code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<script language="JavaScript">
function unhide(xelement){
document.getElementById(xelement).style.visibility="visible";
}
function hide(xelement){
document.getElementById(xelement).style.visibility="hidden";
}
</script>
<body>
<form name='testForm'>
field 1: <input type='text' id='field1' name='field1' onkeyup='unhide("popup1");' onblur='hide("popup1");' autocomplete='off'><br>
field 2: <input type='text' id='field2' name='field2' onkeyup='unhide("popup2");' onblur='hide("popup2");' autocomplete='off'>
</form>
<span style='visibility:hidden; position:absolute; border:1px solid black; background-color:#AAA;' id='popup1'>
<div onclick='document.testForm.field1.value="PC110"; hide("popup1");'>PC110</div>
<div onclick='document.testForm.field1.value="PC120"; hide("popup1");'>PC120</div>
</span>
<span style='visibility:hidden; position:absolute; border:1px solid black; background-color:#A0A;' id='popup2'>
<div onclick='document.testForm.field2.value="xx110"; hide("popup2");'>xx110</div>
<div onclick='document.testForm.field2.value="xx120"; hide("popup2");'>xx120</div>
<div onclick='document.testForm.field2.value="xx130"; hide("popup2");'>xx130</div>
</span>
</body>
</html>

15 years ago

HTML Pages with CSS and JavaScript

contentEditable - Can not delete first character in Firefox

I can edit the text in the span with contentEditable='True' if I do not have a span prior to it... but if I have <span></span> prior to it, the first character is un-deletable (and it moves the element to the right with each press of the delete or backspace key). This only happens in Firefox.

Can anyone explain?

15 years ago

HTML Pages with CSS and JavaScript

Popup dialog at mouse position... works in IE, not Firefox

Ok, thanks for the help. It works now.

15 years ago

HTML Pages with CSS and JavaScript

Popup dialog at mouse position... works in IE, not Firefox

*Note - made minor edit to code

I get 'event is not defined' in Firefox at the line:

if (!event) {

I've see then if(!event){...} code used often for non-IE work arounds, so I'm not sure that is what I am doing wrong.

15 years ago

HTML Pages with CSS and JavaScript

Popup dialog at mouse position... works in IE, not Firefox

This is a basic script that should pop up once the object is clicked... It works in IE, but not Firefox. Any thoughts?

15 years ago

HTML Pages with CSS and JavaScript

httpObject.onreadystatechange passing a variable to function - type mismatch error

Ok, now I got it. Thanks - works great!

15 years ago

HTML Pages with CSS and JavaScript

httpObject.onreadystatechange passing a variable to function - type mismatch error

I'm new to closures, but I understand what that example script does. I'm not sure how to apply it to my script.

15 years ago

HTML Pages with CSS and JavaScript

httpObject.onreadystatechange passing a variable to function - type mismatch error

I'm trying to create a generic AJAX function that has the data field passed to the function in order to return the results to the proper place.

Oddly enough, this does not work if I comment out the 'alert' line in the set_output, however it does work if I have it pop up those variables.

Either way, I do still get a type-mismatch on the line:

I figure that is because you shouldn't pass variables to a function in this way.

Any suggestions would be greatly appreciated!

15 years ago

HTML Pages with CSS and JavaScript

Position cursor at the end in textareas

[Edit: thread hijack removed. Ask your own questions in new topics.]

16 years ago

HTML Pages with CSS and JavaScript

Chris Huber

Recent posts by Chris Huber