0

This is my HTML code - the forms in this are not working. Please help to work out the JavaScript and the HTML to submit these forms with a single click to same database.

JavaScript for the buttons:

    <script>
        submitBothForms = function () {
        document.forms["userinfo"].submit();
        document.forms["userinfo1"].submit();
    }
    </script>
    <script>
    clearForms = function(){
        document.forms["userinfo"].reset();
        document.forms["userinfo1"].reset();
    }
    </script>

HTML code where the both the forms and the buttons exists both the buttons are clear and save the code must be submitted to a single PHP file to a single database and single table.

                        <div class="row">                            
                            <div class="col-sm-12">
                                <div class="bill-to">
                                    <div class="step-one">
                                        <h2 class="heading">Add new Shipping address</h2>
                                    </div>
                                    <div class="form-one">
                                        <form action="userinfo.php" name="userinfo"  method="POST">
                                                <input type="text" name="name" required placeholder="Name">
                                                <input type="email" name="email" required placeholder="Email">
                                                <input type="text" name="address1" required placeholder="Address 1">
                                                <input type="text" name="address2" placeholder="Address 2">
                                        </form>
</div>
                                </div>
                                <div class="form-two">
                                    <form action="userinfo.php" name="userinfo1" method="POST">
                                        <input type="text" name="zip" required placeholder="Zip / Postal Code">
                                        <select>
                                            <option>-- Country --</option>
                                            <option>United States</option>
                                            <option>Bangladesh</option>
                                            <option>UK</option>
                                            <option>India</option>
                                            <option>Pakistan</option>
                                            <option>Ucrane</option>
                                            <option>Canada</option>
                                            <option>Dubai</option>
                                        </select>
                                        <input type="tel" name="contact" required placeholder="Mobile Phone *">
                                        <button type="submit" class="btn btn-primary" style="margin-right: 15px;" onClick="submitBothForms()">Save</button>
                                        <button class="btn btn-primary" onclick="clearForm()">Clear</button>
                                    </form>

                                </div>
                            </div>

                         </div>
halfer
  • 18,701
  • 13
  • 79
  • 158
Ramakrishna B
  • 1
  • 3
  • When editing questions, there is a preview window to show you how the question will look. You may have noticed that your code didn't come out anywhere near how you intended - please use the preview window in future, to help you with getting the code formatting right. Thanks! – halfer Aug 02 '16 at 18:17

2 Answers2

0

You cannot submit two forms using submit button. Only one form can be submitted by the button. Use ajax call to submit the form i.e give two ajax call for the form submit.

jQuery AJAX submit form

Community
  • 1
  • 1
SeeTheC
  • 1,492
  • 11
  • 13
0

this is simply not possible, as each of your fomrs will trigger a rountrip/reload.

Wolfgang
  • 733
  • 4
  • 13