Assign onkeypress-function to dynamically created input-boxes

[vega80]

Hi.

I have a problem with assigning an onkeypress-function to dynamically
created input-boxes.I want to put the content of an input-field into a
tag-list when the user hits enter. This works fine the first time (when
the input-field is created in a non-dynamical way). The next
input-field is created dynamically by a function that is called when
the user hits enter (the previously generated input-field will be
hidden). Then I'm trying to assign an onkeypress-function to the new
element like this:

document.getElementById('tags_element_' +
document.getElementById('tagcount').value).onkeypress = function(event)

But when i press a key in the dynamically created input-field, nothing
happens. Why is this?

Some sample-code below:
----------------------------------------------------------------------------------------------------------------------------------
document.getElementById('tags_element_' +
document.getElementById('tagcount').value).onkeypress =
function(event){
modus = 1;
e = event;

// New file input
if ((e.which == 13 || e.which == 1 || modus == 2) || (modus == 2 ||
e.keyCode == 13)){
var new_element = document.createElement( 'input' );
new_element.type = 'text';
new_element.size = '40';

document.getElementById('tagcount').value =
parseInt(document.getElementById('tagcount').value) + 1;

new_element.id = 'tags_element_' +
document.getElementById('tagcount').value;
var tags = document.getElementById('tagcount').value - 1;
document.getElementById('tags_element_' +
tags).parentNode.insertBefore( new_element,
document.getElementById('tags_element_' + tags) );

// Apply 'update' to element
document.getElementById('tags_element_' +
tags).multi_selector.addElement( new_element );

// Update list
document.getElementById('tags_element_' +
tags).multi_selector.addListRow(
document.getElementById('tags_element_' + tags) );
return false;
}
else{
return true;
}

};
-------------------------------------------------------------------------------------------------------------------
- addListRow creates a new row in the tag-list.
- addElement adds the new element to the multiselector-object that
contains all the input-fields


Thanks in advance!

Vega80

 

[ASM]

vega80 a écrit :

Hi.

I have a problem with assigning an onkeypress-function to dynamically
created input-boxes.I want to put the content of an input-field

into a tag-list

I don't know what it is :-(
(a select ? an ul+li ? other ? what ?)

when the user hits enter.

where does he hits Enter ?

This works fine the first time (when
the input-field is created in a non-dynamical way). The next
input-field is created dynamically by a function that is called when
the user hits enter (the previously generated input-field will be
hidden). Then I'm trying to assign an onkeypress-function to the new
element like this:

Absolutely illegible !
try to use variables when you call several times same element.


function $(x) { return document.getElementById(x); }

// to initialize first text field :

function init() {
var count = $('tagcount').value;
$('tags_element_'+count).onkeypress = function() {
hitEnter(event);
}
$('tagcount').value++;
}

function hitEnter(e) {
e = e || event;
modus = 1;
if (
(e.which == 13 || e.which == 1 || modus == 2) ||
(modus == 2 || e.keyCode == 13)
)
newField();
}

function newField() {
var count = $('tagcount').value*1;
var field = document.createElement('input');
field.name = field.id = 'tags_element_'+count+'';
field.type = 'text';
field.size = 40;
field.onkeypress = function() { hitEnter(event); }
count--;
var target = $('tags_element_'+count+'');
target.parentNode.insertBefore(field, target);
target.multi_selector.addElement(field);
target.multi_selector.addListRow(target);
$('tagcount').value++;
}

Some sample-code below:
----------------------------------------------------------------------------------------------------------------------------------
document.getElementById('tags_element_' +
document.getElementById('tagcount').value).onkeypress =
function(event){
modus = 1;
e = event;

// New file input
if ((e.which == 13 || e.which == 1 || modus == 2) || (modus == 2 ||
e.keyCode == 13)){
var new_element = document.createElement( 'input' );

and where is the onkeypress for the new element ?
not seen ...

when it is possible to do complicated ...