I'm generating a number of textareas with jQuery. I want to retrieve the values of all the filled out textareas via an on-page POST method (it's kind of a proof of concept, quick and dirty, I wouldn't do this normally), but when I hit submit, I get the value of only one, whichever is the last textarea value posted. I imagine I can do this with an array and a foreach loop, but am unsure how to do it, given all the additions of the jQuery/on-page factors complications in this endeavor. I also imagine it might have something to do with all of the generated textareas having the same name... anyone?
Here's the code-
<script type="text/javascript">
$(document).ready(function() {
$('.textadder').click(function(){
$("form").append("<p class='introText2'>Enter More Text</p><textarea rows='5' cols='20' name='textForm' class='formText2'></textarea>");
});
});/*document ready*/
</script>
<?php
if (isset($_POST['textForm']))
{
$formTxt = $_POST['textForm'];
echo $formTxt;
}
?>
</head>
<body>
<div id="wrapper">
<div id="submittedHolder"></div>
<div class="formBox">
<form method="post" action="">
<p class="introText">Please Enter Some Text</p>
<textarea rows="5" cols="20" name="textForm" class="formText"></textarea>
<input type="submit" class="submitter" value="Submit">
</form>
<div class="textadder"><p>More Text</p></div>
<div class="clearer"></div>
</div><!--formBox-->
</div><!--wrapper-->
</body>
</html>
Thanks!
Use textForm[] in your textarea name instead of textForm:
<textarea rows="5" cols="20" name="textForm[]" class="formText"></textarea>
After that all "textForm" textareas would be in $_POST['textForm'] array.
<script type="text/javascript">
$(document).ready(function() {
$('.textadder').click(function(){
$("form").append("<p class='introText2'>Enter More Text</p><textarea rows='5' cols='20' name='textForm[]' class='formText2'></textarea>");
});
});/*document ready*/
</script>
<?php
if (isset($_POST['textForm']))
{
$formTxt = $_POST['textForm'];
foreach($formTxt as $txt){
echo $txt;
}
}
?>
</head>
<body>
<div id="wrapper">
<div id="submittedHolder"></div>
<div class="formBox">
<form method="post" action="">
<p class="introText">Please Enter Some Text</p>
<textarea rows="5" cols="20" name="textForm[]" class="formText"></textarea>
<input type="submit" class="submitter" value="Submit">
</form>
<div class="textadder"><p>More Text</p></div>
<div class="clearer"></div>
</div><!--formBox-->
</div><!--wrapper-->
</body>
</html>
Use array here. the post object will now be an array.