...

View Full Version : How to get the Dynamically created Text Box values



korssane
07-28-2011, 09:49 PM
Hi Peers,

i have a button that helps me creating more than one dynamic text box and dropdownlist...
how it possible to capture the values in those dynamic comtrols ?



i am trying the following but did not work ..when the code is excuted it gives me [object]

// Create Text box 1
var newStartDate = document.createElement('input');
newStartDate.setAttribute("type","date");
newStartDate.size=8;

//capture the value in a temp variable val1
var val1 = document.getElementsByName(newStartDate);
alert(val1);


the alert gives [object]

thanks

jmrker
07-28-2011, 11:15 PM
Two possibilities:

1. You create the dynamic element, but you don't give it a name to look for:
Try: newStartDate.name = 'startDateName'
or possibly: newStartDate.setAttribute("name","startDateName");

2. You are acquiring a collection with getElementsByName() command, but you do not use the name, you use the element created.
Try: var val1 = document.getElementsByName('startDateName');
and you may need to specify which position in the document.
as in: alert(val1[0]);

All of above is untested at this time.
Maybe post some more of your script to evaluate better.

Old Pedant
07-28-2011, 11:20 PM
Ummm...

(1) "date" is *NOT* a valid value for a "type" attribute except in HTML 5. Given the spotty support for HTML 5, are you sure you want to do this?

(2) document.getElementsByName expects (what else?) a *NAME* to search for. And the name must be a STRING. You are passing an object reference, not a string.

(3) On top of that, you never assigned a name (or id) to your newly created input element. So there is no way to search for it by name (or by id).

(4) To get the value of a <form> field, you use (what else) the .value property.

So...

You COULD do

var val1 = newStartDate.value;

And that works so long as newStartDate sill refers to the created element (which won't be true if var newStartDate was given as part of some other function).

But I would think all of this would make more sense as simply:


var newStartDate = document.createElement('input');
newStartDate.name = "StartDate";
newStartDate.size=8;
...
var val1 = document.getElementsByName("StartDate")[0].value;

That code assumes that your newly created field is the only (or at least the first) element with the given name ("StartDate").

************************

Oh, figures. A certain little birdie flew in with the answer faster than I could. <grin/>

Old Pedant
07-28-2011, 11:26 PM
Try: var val1 = document.getElementsByName('startDateName');
and you may need to specify which position in the document.
as in: alert(val1[0]);


Ummm...no.

In that code, val1 will indeed be a collection. And you will indeed need to use an index to access a single element of the collection.

But that *still* will not give you the .value of the element.

You could do

var val1 = document.getElementsByName('startDateName');
alert(val1[0].value);

But I think it is misleading to name the variable val1 when it doesn't represent any value(s) at all.

I'd think you'd at least want to use a name that is more descriptive:


var sdNames = document.getElementsByName('startDateName');
alert(sdNames[0].value);

korssane
07-29-2011, 04:51 PM
Hi Guys ,
thank you somuch for your multiple answers but still not working ..
when i triued the following :

1-
var newStartDate = document.createElement('input');
newStartDate.name = 'StartDateName';
newStartDate.size=8;
var val1 = document.getElementsByName("StartDateName").value;
alert(val1);

the answer is : undefined

2-

var val2 = newStartDate.value;
alert(val2);

i got : empty mesg.



3-
when i assign a value to the text box created : i got : "Hello " message . But i want to show the text typed in the text box and not the value assigned initially

var newStartDate = document.createElement('input');
newStartDate.value="Hello";
newStartDate.size=8;

var val3 = newStartDate.value;
alert(val3);







Can we change that and get element by ID to make things easy ?

thank you.

jmrker
07-29-2011, 05:47 PM
Do you have a link to the problem?
Or can you post some additional code?

On a different plane, what is the purpose of a dynamic button creation
for this project? What is it that you are trying to accomplish?
There may be alternative way to do the same thing.

korssane
07-29-2011, 06:20 PM
hi jmrker,
thanks for the folloup and really appreciate .. i amreally stack with that ..not sure if i can paste a picture of i want it to look like ..
or if possible to send you personally my screen snapshot and full code ..

i need to build a simple continous forms or repetitive DIv where anemployee can go there and *** his time assignment to projects. Let me explain more :

let say i am an emplyee and i am working on 3 diff projects .
i need to go to that page or form and do the following :

click on a button where it it will create different elements that i am going to fill up controls ( dropdown list / 1text box that holds date / 2nd text box holds assignment for the current mont

i will fill the information like this :

1- select 1st project from a dropdown then ,
2- put start date on the text box 1
3- assignment time for the current month on the 2nd text box
4- assignment time for the next month on the 3rd text box
---
---
6- assignment time for the 6th month on the 6th text box


after entering all those informations ion one row , i'll have the choice to proceed with a 2nd project ..if so i ll click on the button again and new controls will show up just under the 1st one created...

i need to have the total calculated (one a i click a button) and values will be stored in a database with save button ..but this operation will be done later once we can capture those values in an array , it will be easy to save them into a db table..




Not sure if it was clear ...

i have attached the view i want and my code in the below files



thanks a lot buddy for your time & help

korssane
08-01-2011, 07:58 PM
Hi JMRKR,

i have been able to capture the controls (textboxes and DropDown lists ) values but i need to store those values into a database table ..

do yo have an idea ?

thanks]

jmrker
08-01-2011, 08:38 PM
Hi JMRKR,

i have been able to capture the controls (textboxes and DropDown lists ) values but i need to store those values into a database table ..

do yo have an idea ?

thanks]

You cannot store information into a database with JS.
You need to use a server-side language to do that.
JS functions with CSS more to improve "eye" appeal in a static HTML page.
If the database table is display only, then you could do that with JS.
Good Luck! :)

korssane
08-01-2011, 08:47 PM
thanks jmker ,

i am actually using coldfusion. I'll try to use it to accomplish my goal.

with the code i posted above ..i am not able to assign different IDs and diferent names to my dynamic generated controls..
Can you help me onm that please ?

thanks

jmrker
08-01-2011, 10:15 PM
thanks jmker ,

i am actually using coldfusion. I'll try to use it to accomplish my goal.

with the code i posted above ..i am not able to assign different IDs and diferent names to my dynamic generated controls..
Can you help me onm that please ?

thanks

See: http://www.dustindiaz.com/add-and-remove-html-elements-dynamically-with-javascript/
and: http://www.dustindiaz.com/add-remove-elements-reprise/
or: http://www.randomsnippets.com/2008/02/21/how-to-dynamically-add-form-elements-via-javascript/

or others with a google search of "javascript add elements"



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum