...

View Full Version : [?] Add more input fields to PHP form



buggy
02-18-2010, 12:33 PM
How would I go about adding more input fields to a PHP form if they are needed?

There seems to be lots of ways with javascript but the problem with that is they are created after
the form is closed and so when you hit the submit button the content within extra fields does not
get submitted ..



<?php
if (isset($_POST['submit']))
{
foreach ($_POST['foo'] as $value)
{
$value = htmlspecialchars($value);
if ($value)
{
echo "$value\n";
}
}
?>

<?php } else { ?>

<form action="index.php" method="post">
<fieldset>
<input type="text" name="foo[]" size="30" />
<br />
<input type="text" name="foo[]" size="30" />
<br />

<!-- Add additonal input fields here if needed by clicking "More" link -->

<input type="submit" name="submit" value="Submit" />
</fieldset>
</form>

<?php } ?>


As always thank you in advance :)

DaiWelsh
02-18-2010, 12:56 PM
How would I go about adding more input fields to a PHP form if they are needed?

You would need to submit the form to the server, repopulate all the values they submitted and add an extra field, then send back to client to continue populating.


There seems to be lots of ways with javascript but the problem with that is they are created after
the form is closed and so when you hit the submit button the content within extra fields does not
get submitted ..


Not sure what you mean by "after the form is closed", it is quite possible to dynamically add fields to a form with javascript that will get submitted with the form exactly as if they were there all along.

Possibly the problem is to do with how/where you are adding the fields and/or what names you are giving them. As long as the fields are added within the form and are given the correct name they should submit just fine.

If you have an example of a javascript solution that doesn't submit perhaps we could see what is wrong...?

HTH,

Dai

buggy
02-18-2010, 01:04 PM
< Head >


<script language="javascript">
fields = 0;
function addInput() {
if (fields != 10) {
document.getElementById('text').innerHTML += "<input type='text' name='foo[]' size='30' />";
fields += 1;
} else {
document.getElementById('text').innerHTML += "<br />Maximum 10 fields allowed.";
document.form.add.disabled=true;
}
}
</script>


< body > Added between last main input and submit button:

<input type="button" onclick="addInput()" name="add" value="Add input field" />

The additional fields are created by clicking button but not submitted

DaiWelsh
02-18-2010, 01:10 PM
Is there a URL? If I copy this into my own code for the form it may not reproduce the problem you are having.

Other solutions I have seen use the DOM to add a DOM object "properly" rather than just squirting HTML into a container and assuming the browser will handle it, but that said I still would have expected it to work myself.

Regards,

Dai

DaiWelsh
02-18-2010, 01:17 PM
Works for me here:

http://www.metatest.co.uk/test_dyninput.php

in IE and firefox, possibly you are adding to the wrong container, so if you can show your form code....

HTH,

Dai

buggy
02-18-2010, 01:52 PM
Thank you DaiWelsh after a little tweaking it was what you suggested I had the main inputs wrapped in a different <div container

DaiWelsh
02-18-2010, 01:57 PM
welcome

lzlpio90
06-15-2011, 04:30 AM
hi,i have the same problem to... can u please help me add input fields (3 INPUT FIELD, 1 SELECT & 1 RADIO BUTTON) in one line at the same time?

i tried adding the text input but i find it hard to add the select and radio button..

please,,anyone help... and response will be highly appreciated...

thanks,
Liezl

DaiWelsh
06-15-2011, 10:16 AM
If you post your code (or ideally a URL) then I am sure someone, possibly me, will take a look. There are lots of ways to skin a cat so it helps if we know where you are starting from...

fmsalinas
08-23-2012, 02:00 PM
Hi, i know this a very old thread, but i found it usefull. Tanksyou all for your knoledges! I', having only one problem. and its that if i have completed some fileds, they reset when adding more fields. Any idea on how to skip form reseting? thanks!



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum