jquery Multiple form and file submition in php file

Question

i am trying to submit multiple form using jquery .. but the problem is i am getting this error message

Undefined index: box3 in C:\xampp\htdocs\test\approve_test.php on line 4

my html/jquery code:

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<SCRIPT LANGUAGE="JavaScript" type="text/javascript">
/* Collect all forms in document to one and post it */
function submitAllDocumentForms() {
    var arrDocForms = document.getElementsByTagName('form');
    var formCollector = document.createElement("form");
    with(formCollector)
    {
        method = "post";
        action = "approve_test.php";
        name = "formCollector";
        id = "formCollector";
        processData: false;
        contentType: false;
    }
    for(var ix = 0 ; ix < arrDocForms.length ; ix++) {
        appendFormVals2Form(arrDocForms[ix], formCollector);
    }
    document.body.appendChild(formCollector);
    formCollector.submit();
}

/* Function: add all elements from frmCollectFrom and append them to 
             frmCollector before returning frmCollector*/
function appendFormVals2Form(frmCollectFrom, frmCollector) {
    var frm = frmCollectFrom.elements;
    for(var ix = 0 ; ix < frm.length ; ix++)
        frmCollector.appendChild(frm[ix]);
    return frmCollector;
}
</SCRIPT>
</head>
<body>

<FORM METHOD=POST ACTION="approve_test.php" NAME="form1" id="form1">
    <INPUT TYPE="text" NAME="box1" size="20" >
</FORM>
FORM2:
<FORM METHOD=POST ACTION="approve_test.php" NAME="form2" id="form2">
    <INPUT TYPE="text" NAME="box2" size="20" >
</FORM>
<FORM METHOD=POST ACTION="approve_test.php" NAME="form2" id="form2">
    <INPUT TYPE="file" NAME="box3" >
</FORM>

<INPUT TYPE="button" value="Submit Form all" onClick="submitAllDocumentForms()">

</body>
</html>

and php :

<?php
    $name=trim($_POST["box1"]);
    $fname=trim($_POST["box2"]);
    $file_name=$_FILES["box3"]["name"];
    echo $name."<br>".$fname."<br>".$filename;
?>

can someone plzz help ... i am just a beginner ....

when your post is with same action, what is the need for different forms?? — Niranjan N Raju, Sep 15 '15 at 07:25
its just a demo of what i am doing ... there are multiple forms for design purpose .. — Pulak Roy, Sep 15 '15 at 07:30
yes i can .. but the main thing i am trying to do is i am testing .. is possible to merge multiple form and send it via post method .. as research .. as i am not an jquery expert i am stuck here .. can u help me — Pulak Roy, Sep 15 '15 at 07:38

Niranjan N Raju · Accepted Answer · 2015-09-15T11:01:30.590

0

Here is the code which you want

HTML part

<!DOCTYPE html>
   <html>
   <head>
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
   <script LANGUAGE="JavaScript" type="text/javascript">            
        function submitAllDocumentForms() {
              $("#aaa").val($('form').serialize());
        }
   </script>
   </head>
   <body>

        <FORM id="form1" method="post">
            <INPUT TYPE="text" NAME="box1" size="20" >
    </FORM>
    FORM2:
    <FORM id="form2" method="post">
        <INPUT TYPE="text" NAME="box2" size="20" >
    </FORM>
    <FORM id="form3" method="post" enctype="multipart/form-data" action="<?= base_url("dummy/aaa") ?>">
        <INPUT TYPE="file" NAME="box3" >
        <input type="hidden" name="a" id="aaa" />
        <INPUT TYPE="submit" value="Submit Form all" onClick="submitAllDocumentForms()">
    </FORM>



</body>
</html>

PHP part

$arr = explode("&", $_POST['a']);

    foreach ($arr as $item) {
        $array = explode("=", $item);
        $post[$array[0]] = $array[1];
    }

    $file_name = $_FILES["box3"]["name"];
    echo $post['box1']. "<br>" . $post['box2']. "<br>" . $file_name;

edited Sep 15 '15 at 11:01

answered Sep 15 '15 at 08:08

Niranjan N Raju

12,047
4
22
41

:( still not working – Pulak Roy Sep 15 '15 at 08:56
Its a working example, what error you are getting?? – Niranjan N Raju Sep 15 '15 at 08:59
Access forbidden! You don't have permission to access the requested object. It is either read-protected or not readable by the server. If you think this is a server error, please contact the webmaster. Error 403 localhost Apache/2.4.16 (Win32) OpenSSL/1.0.1p PHP/5.6.12 – Pulak Roy Sep 15 '15 at 09:08
action="= base_url("dummy/aaa") ?> – Pulak Roy Sep 15 '15 at 09:09
in this path i suppose to send the php file path right – Pulak Roy Sep 15 '15 at 09:09
ya... that's the path in my localhost, you can specify the action as `ACTION="approve_test.php"` – Niranjan N Raju Sep 15 '15 at 09:11
thanks it works ..:) btw one more q .. if i want to get the file deta then what should i do ? – Pulak Roy Sep 15 '15 at 10:21
try printing $_FILES in your php code – Niranjan N Raju Sep 15 '15 at 10:25
thanks a lotttt ...:) – Pulak Roy Sep 15 '15 at 10:28
no ..:( .. $_FILES is empty .. i tried var_dump($_FILES); .. and it shows empty – Pulak Roy Sep 15 '15 at 10:30
is file input present in 3rd form?? – Niranjan N Raju Sep 15 '15 at 10:31
yes ..... it is .. i define input type file – Pulak Roy Sep 15 '15 at 10:33
ok i ll give u the updated code after some time... – Niranjan N Raju Sep 15 '15 at 10:34
i have updated my answer, i ve added enctype for form in html and in php the way we collect the uploaded file name is changed. you can have a check – Niranjan N Raju Sep 15 '15 at 11:02
thanks a lot .. its working now ..:) – Pulak Roy Sep 15 '15 at 11:14

jquery Multiple form and file submition in php file

1 Answers1