how to get element's Id or name for dynamically created element(textbox)

zimbu · #1 August 29th, 2008, 01:43 PM

Hi all,

I have created some textboxes dynamically by using

var sun = document.createElement('input'); with button click.

after some time I will re visit the fields, how do I retrive that element's Id or name onblur event.

Bythe following code I used to get the value of the specified element, but I want id or name of that element .

Expand|Select|Wrap|Line Numbers

 <html>

<head>

<script language="javascript">

function init(){

newFieldElement = document.createElement( 'INPUT' );

newFieldElement.onblur = show;

document.body.appendChild(newFieldElement);
 
newFieldElement1 = document.createElement( 'INPUT' );

newFieldElement1.onblur = show;

document.body.appendChild(newFieldElement1);

}

function show(){

alert( this.value );

}

</script>

</head>

<body onload="init()">

</body>

</html>

code examples are highly appreciated.

Thanks & regards,
zimbu

Dormilich · #2 August 29th, 2008, 09:26 PM

Before you can retrieve an id or name you have to set them (while creation). Otherwise, how should the browser know which value to assign?
if id and name are set you can access them with (in case of the 1st input field)

Expand|Select|Wrap|Line Numbers

 document.getElementsByTagName("input")[0].id // and

document.getElementsByTagName("input")[0].name

Ferris · #3 August 30th, 2008, 01:02 PM

Hi,you should set id and name when creating them. If you didn't set id,it will be null.

I write an example for you.

Expand|Select|Wrap|Line Numbers

 
<html>

<head>

<script language="javascript">

function init()

{

    //element with NO id

    newFieldElementNoId = document.createElement( 'INPUT' );

    newFieldElementNoId.onblur = show;

    document.body.appendChild(newFieldElementNoId);
 
    //element with id

    var i;

    for ( i=0;i<5;i++)

    {

        newFieldElement = document.createElement( 'INPUT' );

        newFieldElement.setAttribute('id','myfieldid'+i);

        newFieldElement.setAttribute('name','myfieldname'+i);

        newFieldElement.onblur = show;

        document.body.appendChild(newFieldElement);

    }

}

function show(){
 
    alert( 'id=' + this.getAttribute('id') + "\n" +  'name=' + this.getAttribute('name') + "\n" + "value=" + this.value );

}

</script>

</head>

<body onload="init()">

</body>

</html>

What is Bytes?

Popular Articles