creating a button that will add text boxes

R

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
 
J

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)" />
 
R

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
 
R

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
 
R

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
 
R

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
 
J

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...
 
J

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 :]
 
R

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
 
R

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
 
R

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
 
J

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 :]
 
D

Dr John Stockton

JRS: In article <[email protected]>
, dated Wed, 4 Jan 2006 18:26:39 local, seen in
news:comp.lang.javascript said:
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.
 
R

Randy Webb

Dr John Stockton said the following on 1/6/2006 11:54 AM:
JRS: In article <[email protected]>
, dated Wed, 4 Jan 2006 18:26:39 local, seen in
news:comp.lang.javascript said:
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.
 
D

Dr John Stockton

JRS: In article <[email protected]>, dated Fri, 6 Jan
2006 15:15:42 local, seen in Randy Webb
Dr John Stockton said the following on 1/6/2006 11:54 AM:
JRS: In article <[email protected]>
, dated Wed, 4 Jan 2006 18:26:39 local, seen in
news:comp.lang.javascript said:
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.
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.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,754
Messages
2,569,526
Members
44,997
Latest member
mileyka

Latest Threads

Top