I've multiple forms each having multiple checkboxes. For all the forms there is a single submit provided at some where down in the page so that when clicked it will previews all the checkboxed info
<form name="a1" action="start.php" method="post">
<input type="checkbox" id="add" name="check_list[]" value="x1">x1
<input type="checkbox" id="add" name="check_list[]" value="x2">x2
<input type="checkbox" id="add" name="check_list[]" value="x3">x3
</form>
<form name="a2" action="start.php" method="post">
<input type="checkbox" id="add" name="check_list[]" value="y1">y1
<input type="checkbox" id="add" name="check_list[]" value="y2">y2
<input type="checkbox" id="add" name="check_list[]" value="y3">y3
</form>
<form name="a3" action="start.php" method="post">
<input type="checkbox" id="add" name="check_list[]" value="z1">z1
<input type="checkbox" id="add" name="check_list[]" value="z2">z2
<input type="checkbox" id="add" name="check_list[]" value="z3">z3
</form>
<div> <input type="submit" value="preview" onclick="addForm()"> </div>
where in validateform is
<script type="text/javascript">function addForm(){
document.forms["a1"].submit();
document.forms["a2"].submit();
document.forms["a3"].submit();
}
and start.php is
<?php
if(!empty($_POST['check_list'])) {
foreach($_POST['check_list'] as $check) {
echo $check."<br/>";
}
}
?>
Problem is am not able to append all forms the data by the function addForm() Please help me understand how all the check boxes info can be shown which taken from all forms with PHP
It is not possible to submit more than one form at once in this manner. If you wanted to take this approach, you would need to use AJAX, as this is the only way to have the browser maintain more than one active request.
Looking at the code though, I can't see any reason that you would need more than one form. You should be able to simply do this:
<form name="a1" action="start.php" method="post">
<input type="checkbox" id="add" name="check_list[]" value="x1">x1
<input type="checkbox" id="add" name="check_list[]" value="x2">x2
<input type="checkbox" id="add" name="check_list[]" value="x3">x3
<input type="checkbox" id="add" name="check_list[]" value="y1">y1
<input type="checkbox" id="add" name="check_list[]" value="y2">y2
<input type="checkbox" id="add" name="check_list[]" value="y3">y3
<input type="checkbox" id="add" name="check_list[]" value="z1">z1
<input type="checkbox" id="add" name="check_list[]" value="z2">z2
<input type="checkbox" id="add" name="check_list[]" value="z3">z3
<div><input type="submit" value="preview"></div>
</form>
...for which you don't even need any Javascript.
If you want all the data to go to start.php, you should simply use a single form.
Side note: You shouldn't have the id attribute of the inputs all set to "add". id should be unique.
If you must have multiple form for this, like you state in a comment then you need more extensive javascript.
One form submit = one http request, 3 won't work, but what you can do is bind all those form so when one is submitted you can collect the data of ALL inputs in ALL forms and serialize the lot and then send that as a GET request. remember to disable the default behaviour so the form doesn't submit as such.
Or if you must have a POST request, create a temporary form and create input with the correct values inside then submit that form.
When you call the submit function on the first form "a1", you automatically send the data to start.php, and the other two forms wont be submitted. Best solution: ajax
XMLHTTPRequest allows you to post forms and get a reply without leaving the page and you can combine the results from all three form submits and display them together
If you're the author of HTML code in question, I'd suggest you refactor your code and create only one form that envelops all the checkboxed and the submit button. If it's styling that troubles you, you can simply place input elements in appropriate <fieldset> elements.
Otherwise, if you're stuck with HTML code that you did not write, I'd suggest that you do the following (although it's really not a pretty solution):
Edit the addForm() function to create a fourth <form> element somewhere in the document, and set its style to display: none;. Then append or clone all the checkboxes from previous forms to this new form, and submit it. That should give you a collection of checkboxes which you can handle on PHP side like you would if the initial HTML code was written properly.
For submitting multiple form you have two solutions:
1) Using Ajax request 2) Append all the information in a final form and submit that, for doing so you can simply use jQuery or javascript.