creating a button that will add text boxes

[Rick]

Hello,

I'm trying to create a javascript function that will allow the user to
press a button within the html code that will add a text box right
above the button. If the user presses it a second time it should add a
second text box right under the previous text box. Any ideas?

Thanks!

Rick

[Jonas Raoni]

Rick escreveu:

I'm trying to create a javascript function that will allow the user to
press a button within the html code that will add a text box right
above the button. If the user presses it a second time it should add a
second text box right under the previous text box. Any ideas?

Use insertBefore :)

<script type="text/javascript">
function add(o){
var i = document.createElement("input"), p = o.parentNode;
i.type = "text", p.insertBefore(i, o),
p.insertBefore(document.createElement("br"), o);
}
</script>

<input type="button" value="New Input" onclick="add(this)" />
--
Jonas Raoni Soares Silva
http://www.jsfromhell.com

[Rick]

thanks!

what if i want to add a row of three text boxes when the button is
clicked? and my last and final question is how do i assign those
textboxes as part of a sql based database (aka...i want the first
textbox to be "date" the second to be assigned as "name" and the last
to be assigned as "comment")? thank you so much!

Rick

[Rick]

maybe this will help:

the javascript code you posted is great. i want to make it so that
when the button is pressed it outputs something like this:

<table>
<tr>
<td>Date: <input type="text" name="date"></td>
<td>Name: <select name="name"> ***this will be a list from the
database*** </td>
<td>Comment: <textarea class="formfield" style="width: 300"
name=comment"></textarea></td>
</tr>
</table>

is there anyway to recreate that html within the javascript script
function? thanks!

Rick

[Rick]

maybe this will help:

the javascript code you posted is great. i want to make it so that
when the button is pressed it outputs something like this:

<table>
<tr>
<td>Date: <input type="text" name="date"></td>
<td>Name: <select name="name"> ***this will be a list from the
database*** </td>
<td>Comment: <textarea class="formfield" style="width: 300"
name=comment"></textarea></td>
</tr>
</table>

is there anyway to recreate that html within the javascript script
function? thanks!

Rick

[Rick]

maybe this will help:

the javascript code you posted is great. i want to make it so that
when the button is pressed it outputs something like this:

<table>
<tr>
<td>Date: <input type="text" name="date"></td>
<td>Name: <select name="name"> ***this will be a list from the
database*** </td>
<td>Comment: <textarea class="formfield" style="width: 300"
name=comment"></textarea></td>
</tr>
</table>

is there anyway to recreate that html within the javascript script
function? thanks!

Rick

[Jonas Raoni]

Rick escreveu:

what if i want to add a row of three text boxes when the button is
clicked? and my last and final question is how do i assign those
textboxes as part of a sql based database (aka...i want the first
textbox to be "date" the second to be assigned as "name" and the last
to be assigned as "comment")? thank you so much!

Well, it seems that you want me to do your job hahahaha, but it's ok,
I'm unemployed and today I really have nothing to do, I'm just playing
CS :D

<form id="form">
<input type="button" name="btnAdd" value="New Input" />
</form>

<script type="text/javascript">
(function(){
var o, i, btn, count = -1, p = (btn =
document.forms.form.btnAdd).parentNode;
btn.onclick = function(){
for(i in ++count, {date: 0, name: 0, comment: 0}){
o = document.createElement("input");
o.type = "text";
o.value = o.name = i + count;
p.insertBefore(o, btn);
}
p.insertBefore(document.createElement("br"), btn);
};
})();
</script>

I hope it's what you want...
--
Jonas Raoni Soares Silva
http://www.jsfromhell.com

[Jonas Raoni]

Rick escreveu:

i want to make it so that when the button is pressed it outputs something like this:
<table>
:
</table>

is there anyway to recreate that html within the javascript script
function? thanks!

Sure, take a look at my example and make some modifications on your own
;]

It's very simple, basically you'll just need "newNode =
document.createElement(tagName)" and
"parentElement.appendChild(newNode)"...

But you also can create a html string (I always try to avoid using
innerHTML, it looks like the eval function...) and write something
like:

element.innerHTML = "<b>i've got the power to fly into the wind, the
power to be free, to die and live again =]</b>";

Good luck, it's time to eat :]
--
Jonas Raoni Soares Silva
http://www.jsfromhell.com

[Rick]

thanks so much for the help jonas!

im new to this javascript stuff and i thought i could just put my html
right into the script...bad idea...hahaha

thanks again!

rick

[Rick]

thanks so much for the help jonas!

im new to this javascript stuff and i thought i could just put my html
right into the script...bad idea...hahaha

thanks again!

rick

[Rick]

quick question,

when you say "element.innerHTML", do you mean I can put all the html
code that I listed to you within the equal signs after that tag?
thanks!

rick

[Jonas Raoni]

Rick escreveu:

when you say "element.innerHTML", do you mean I can put all the html
code that I listed to you within the equal signs after that tag?

Yeah, that's it... :)

If you want to add a "<b>" in the end of an element, you can make
something like
element.innerHTML += "<b>aaaa</b>";

PS: try to not send the same message several times, it takes just a
little while to appear :]
--
Jonas Raoni Soares Silva
http://www.jsfromhell.com

[Dr John Stockton]

JRS: In article <11**********************@g14g2000cwa.googlegroups .com>
, dated Wed, 4 Jan 2006 18:26:39 local, seen in
news:comp.lang.javascript, Jonas Raoni <jo********@gmail.com> posted :

PS: try to not send the same message several times, it takes just a
little while to appear :]

For everybody, the time is non-zero; but all proper news servers will
show a posted article almost immediately. When giving advice
specifically for Google users, please indicate it as such.

Remember : News has been operating for decades; it has developed
effective standards and conventions, and newsreaders and servers that
respect these.

Upstart web-based systems ignore these, to the disadvantage of those who
don't realise that they could be using a properly-designed service.

--
© John Stockton, Surrey, UK. ?@merlyn.demon.co.uk Turnpike v4.00 MIME ©
Web <URL:http://www.uwasa.fi/~ts/http/tsfaq.html> -> Timo Salmi: Usenet Q&A.
Web <URL:http://www.merlyn.demon.co.uk/news-use.htm> : about usage of News.
No Encoding. Quotes before replies. Snip well. Write clearly. Don't Mail News.

[Randy Webb]

Dr John Stockton said the following on 1/6/2006 11:54 AM:

JRS: In article <11**********************@g14g2000cwa.googlegroups .com>
, dated Wed, 4 Jan 2006 18:26:39 local, seen in
news:comp.lang.javascript, Jonas Raoni <jo********@gmail.com> posted :

PS: try to not send the same message several times, it takes just a
little while to appear :]
For everybody, the time is non-zero;

That is, obviously, not true.
but all proper news servers will show a posted article almost immediately.
That is not always true either. The time it takes to show an article is
based on more than "proper news servers". I use a "proper news servers"
but it does not always "immediately" show a new article. It depends on
server traffic among other things.

And, "almost immediately" is not "non-zero" time.
When giving advice specifically for Google users, please indicate it as such.

That advice applies to other users besides Google users. Even if it is a
Google user that invokes that advice.

--
Randy
comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/

[Dr John Stockton]

JRS: In article <LO********************@comcast.com>, dated Fri, 6 Jan
2006 15:15:42 local, seen in news:comp.lang.javascript, Randy Webb
<Hi************@aol.com> posted :

Dr John Stockton said the following on 1/6/2006 11:54 AM:

JRS: In article <11**********************@g14g2000cwa.googlegroups .com>
, dated Wed, 4 Jan 2006 18:26:39 local, seen in
news:comp.lang.javascript, Jonas Raoni <jo********@gmail.com> posted :

PS: try to not send the same message several times, it takes just a
little while to appear :]
For everybody, the time is non-zero;

That is, obviously, not true.

The article has to travel to some form of news server and back, and be
processed on the sending, serving, and receiving machines. That cannot
happen in zero time.

but all proper news servers will show a posted article almost immediately.

That is not always true either. The time it takes to show an article is
based on more than "proper news servers".

I was writing about proper news servers, as can be told from my use of
those words.
I use a "proper news servers"
but it does not always "immediately" show a new article. It depends on
server traffic among other things.
I wrote "almost" to allow for such things.

And, "almost immediately" is not "non-zero" time.

Of course it is. "Almost immediately" is slower than "immediately"; and
"immediately" implies "subsequently", which tales longer than zero time.

--
© John Stockton, Surrey, UK. ??*@merlyn.demon.co.uk Turnpike v4.00 MIME. ©
Web <URL:http://www.merlyn.demon.co.uk/> - FAQish topics, acronyms, & links.
Check boilerplate spelling -- error is a public sign of incompetence.
Never fully trust an article from a poster who gives no full real name.

[saer sae]

How about with drop down?

*** Sent via Developersdex http://www.developersdex.com ***