adding onkeyup to input field

[Lee]

I have this function that doesn't work. I pass it the td element and
an id, and it makes an input field inside the td. That part workds.
What doesn't work is that I want to add an "onkeyup" on the input
field. Any help? Please??? I don't get any error on my javascript
console in firefox, and I am not seeing any errors in IE.

// makes an input field that submits itself using setCalendarValu e()
when it's blurred (it will be blurred if [enter] is pressed)
function makeCalendarInp utField(el,hour sId,which){
var id=el.id;

// if this input field is already active, then don't let it be
activated again
if(thisCalendar InputField==id) {
return false;
}
else{
thisCalendarInp utField=id;
}
var value = el.innerHTML;
// remember the original value just in case
originalValue=v alue;
el.innerHTML='' ;
var inputField = "<input type='text' value='" + value + "'
name='inputFiel d' id='inputField' "
+ " onBlur='setCale ndarValue(this, \"" + id + "\");'
class='calendar InputField' />"
+ "<input type='hidden' name='" + whichField + "' id='" +
whichField + "' value='" + which + "' />"
+ "<input type='hidden' name='" + hoursIdField + "' id='" +
hoursIdField + "' value='" + hoursId + "' />"
+ "";
// change the innerHTML of this td into this input field
el.innerHTML = inputField;
document.getEle mentById('input Field').focus() ;

el.onKeyUp="ale rt('hi')";

return;
}

[RobG]

Lee wrote:

I have this function that doesn't work. I pass it the td element and
an id, and it makes an input field inside the td. That part workds.
What doesn't work is that I want to add an "onkeyup" on the input
field. Any help? Please??? I don't get any error on my javascript
console in firefox, and I am not seeing any errors in IE.

// makes an input field that submits itself using setCalendarValu e()
when it's blurred (it will be blurred if [enter] is pressed)
function makeCalendarInp utField(el,hour sId,which){
var id=el.id;

// if this input field is already active, then don't let it be
activated again

Do not allow posted code to auto-wrap, it nearly always introduces more
errors. Manually wrap code at about 70 characters and use 2 spaces for
indents, not tabs.

if(thisCalendar InputField==id) {

I guess the value of - thisCalendarInp utField - is set elsewhere.

return false;
}
else{

There is no need for an else after a conditional return.

thisCalendarInp utField=id;
}
var value = el.innerHTML;
// remember the original value just in case
originalValue=v alue;
el.innerHTML='' ;
var inputField = "<input type='text' value='" + value + "'
name='inputFiel d' id='inputField' "
+ " onBlur='setCale ndarValue(this, \"" + id + "\");'
class='calendar InputField' />"

The use of mixed-case attribute names in the source markup is a bad
habit, use all lower case (even though HTML doesn't care about case).

Your tag syntax indicates XHTML, but your attribute names appear to
require HTML. The use if innerHTML also infers the use of HTML (though
there is no standard to indicate whether that is a reasonable inference
or not).

Use HTML 4.01, there are no practical benefits to using XHTML on the
web.

+ "<input type='hidden' name='" + whichField + "' id='" +
whichField + "' value='" + which + "' />"
+ "<input type='hidden' name='" + hoursIdField + "' id='" +
hoursIdField + "' value='" + hoursId + "' />"
+ "";
// change the innerHTML of this td into this input field
el.innerHTML = inputField;
document.getEle mentById('input Field').focus() ;

el.onKeyUp="ale rt('hi')";

Javascript is case sensitive:

el.onkeyup = "alert('hi' )";

The use of all lower case attribute names (and tag names too) is a good
habit to get into, especially if you really do intend to use XHTML.
--
Rob

[Lee]

Do not allow posted code to auto-wrap, it nearly always introduces more

errors. Manually wrap code at about 70 characters and use 2 spaces for
indents, not tabs.

ok I hope I got it not wrapping, because I really do appreciate the
help. I've changed things as I've understood them (I really don't
understand XHTML/HTML, so I hope it's besides the point). After I
changed the function, it still works as always.

I realized I didn't use the correct element for "onkeyup," but it's
still not working. Still no javascript errors. Any further help is
really appreciated. Thanks on everything so far!

// makes an input field that submits itself using
// setCalendarValu e() when it's blurred (it will be blurred if [enter]
is pressed)
function makeCalendarInp utField(el,hour sId,which){
var id=el.id;

// if this input field is already active,
// then don't let it be activated again
if(thisCalendar InputField==id) {
return false;
}
thisCalendarInp utField=id;
var value = el.innerHTML;
// remember the original value just in case
originalValue=v alue;
el.innerHTML='' ;
var inputField =
"<input type='text' value='" + value
+ "' name='inputFiel d' id='inputField' "
+ " onblur='setCale ndarValue(this, \"" + id
+ "\");' class='calendar InputField' />"
+ "<input type='hidden' name='" + whichField
+ "' id='" + whichField + "' value='" + which + "' />"
+ "<input type='hidden' name='" + hoursIdField + "' id='"
+ hoursIdField + "' value='" + hoursId + "' />"
+ "";
// change the innerHTML of this td into this input field
el.innerHTML = inputField;

var inputEl=documen t.getElementByI d('inputField') ;
inputEl.focus() ;

inputEl.onkeyup = "alert('hi' )";

return;
}

[Lee]

By the way, I am going to use a separate library that adds onkeyup in
this fashion, and I'm just using alert to test things out in the
meantime. The library works perfectly elsewhere on an input field that
is already defined when the page loads.

[ASM]

Lee a écrit :

I have this function that doesn't work. I pass it the td element and
an id, and it makes an input field inside the td. That part workds.
What doesn't work is that I want to add an "onkeyup" on the input
field. Any help? Please??? I don't get any error on my javascript
console in firefox, and I am not seeing any errors in IE.

I do not understand,
you can add a onblur :
+ " onBlur='setCale ndarValue(this
and can't add a onkeyup ?

Why ?
In your function, from where comes 'thisCalendarIn putField' ?

It certainly would have been better to use createElement + appendChild
instead to use innerHTML ...

--
ASM

[ASM]

Lee a écrit :

I realized I didn't use the correct element for "onkeyup," but it's
still not working. Still no javascript errors. Any further help is
really appreciated. Thanks on everything so far!

....

function makeCalendarInp utField(el,hour sId,which){
var id=el.id;

// if this input field is already active,
// then don't let it be activated again

from where comes this 'thisCalendarIn putField' ?
what is it ?

if(!thisCalenda rInputField.dis abled)
{
thisCalendarInp utField.disable d=true;
return;
}

if(thisCalendar InputField==id) {
return false;
}
thisCalendarInp utField=id;
var value = el.innerHTML;
// remember the original value just in case
originalValue=v alue;

// variante :
while(el.firstC hild) el.removeChild( el.firstChild);
var field = document.create Element('input' );
field.name = 'inputField';
field.id = 'inputField';
field.onblur = function() { setCalendarValu e(this,'id'); }
el.appendChild( field);
field = document.create Element('input' );
field.name = whichField; // don't know from where 'whichField' comes
field.id = whichField;
field.value = which;
field.setAttrib ute = ('type', 'hidden');
el.appendChild( field);
field = document.create Element('input' );
field.type = 'hidden';
field.name = hoursIdField;
field.id = hoursIdField;
field.value = hoursId;
el.appendChild( field);

var inputEl=documen t.getElementByI d('inputField') ;
inputEl.focus() ;

inputEl.onkeyup = function() { alert('hi'); };

return;
}

[Lee]

Thanks, I think it will take me a little while to understand the child
functions and everything, but it looks like it might work.

On Oct 20, 10:24 am, ASM <stephanemoriau x.NoAd...@wanad oo.fr.invalid>
wrote:

Lee a écrit :

I realized I didn't use the correct element for "onkeyup," but it's
still not working. Still no javascript errors. Any further help is
really appreciated. Thanks on everything so far!

...

function makeCalendarInp utField(el,hour sId,which){
var id=el.id;

// if this input field is already active,
// then don't let it be activated againfrom where comes this 'thisCalendarIn putField' ?

what is it ?

if(!thisCalenda rInputField.dis abled)
{
thisCalendarInp utField.disable d=true;
return;
}

if(thisCalendar InputField==id) {
return false;
}
thisCalendarInp utField=id;
var value = el.innerHTML;
// remember the original value just in case
originalValue=v alue;// variante :

while(el.firstC hild) el.removeChild( el.firstChild);
var field = document.create Element('input' );
field.name = 'inputField';
field.id = 'inputField';
field.onblur = function() { setCalendarValu e(this,'id'); }
el.appendChild( field);
field = document.create Element('input' );
field.name = whichField; // don't know from where 'whichField' comes
field.id = whichField;
field.value = which;
field.setAttrib ute = ('type', 'hidden');
el.appendChild( field);
field = document.create Element('input' );
field.type = 'hidden';
field.name = hoursIdField;
field.id = hoursIdField;
field.value = hoursId;
el.appendChild( field);

var inputEl=documen t.getElementByI d('inputField') ;
inputEl.focus() ; inputEl.onkeyup = function() { alert('hi'); };

return;
}

[ASM]

Lee a écrit :

Thanks, I think it will take me a little while to understand the child
functions and everything, but it looks like it might work.

the important corrections where :

>field.onblur = function() { setCalendarValu e(this,'id'); }

and

>inputEl.onkeyu p = function() { alert('hi'); };

[Lee]

Thanks! But I'm so confused.
Why does this work
inputEl.onkeyup = function() { alert('hi'); };
instead of
inputEl.onkeyup ="alert('hi' )";

Also, I don't know if this will help me in the long run, since I'm
trying to use a library's class in order to do what I need. The syntax
will be: (and it works elsewhere)

var input=value;
var options2 = {
script:"employe eSuggestion.php ?",
varname:"input" ,
minchars:1
};
// add autosuggest
var inputFieldAs = new AutoSuggest(inp utEl.id, options2);

ASM wrote:

Lee a écrit :

Thanks, I think it will take me a little while to understand the child
functions and everything, but it looks like it might work.

the important corrections where :

field.onblur = function() { setCalendarValu e(this,'id'); }

and

inputEl.onkeyup = function() { alert('hi'); };

[Lee]

Actually in the object itself it's using that function technique... I
bet that the real problem arises because I am puting in the <input>
after the page loads. How do I manually insert it into the DOM? Do
you think this is really my problem?