jQuery ajax post data with javascript submit form

Question

This is my code:

<html>
<body>
<?php
include('header.php');
?>
<div class="page_rank">
 <form name="search" id="searchForm" method="post">
 <span class="my_up_text">ENTER THE WEBSITE TO CHECK GOOGLE PAGE RANK:</span>
 <br /><br />
 <input type="text" name="my_site"/></form></div>
<div class="p_ity">
<a href="#" class="btn" onclick="sub_form();">PAGE RANK</a></div>
<div id="my_pass"></div>

      <script>
      function sub_form()
      {

          document.forms["search"].submit();
      }
        $(function () {
            $('form#searchForm').on('submit', function(e) {
                $.ajax({
                    type: 'post',
                    url: 'check-google-page-rank.php',
                    data: $('form').serialize(),
                    success: function (data) {
                        $('#my_pass').html(data);

                    }
                });
                e.preventDefault();
            });
        });     
    </script>
 </body>
 </html>

The problem is the ajax post works perfect if I use a submit button in the form.It doesn't work if I use a sub_form() method to submit the form after on click event.My doubt is will the java script sub_form() method trigger the jquery ajax function or not?

Note:

The data returned by the post url is echo "<img width=\"165\" height=\"55\" src=\"./images/page-rank/pr".$rank.".gif\" />"

The name and id of the form should be the same, unless you know 110% what you're doing. — Jonast92, Jun 04 '14 at 15:13
@Jonast92 This is first time I am hearing something like that....r u serious? — user1613360, Jun 04 '14 at 15:15
I think you might find your answer here http://stackoverflow.com/questions/1960240/jquery-ajax-submit-form — Naeem Shaikh, Jun 04 '14 at 15:21
@NaeemShaikh27 Nope my question is different my ajax works if I use the default form submit button I want to know how to make it work if I use a js submit function. — user1613360, Jun 04 '14 at 15:24

score -1 · Answer 1 · answered Jun 04 '14 at 18:49

-1

document.forms[].property

This returns an array of all the forms in the current document.

Since it is a array, you should pass the index value as integer.

document.forms[0].submit();

this will submit the form, if you have this form as your first form in the html page from top.

answered Jun 04 '14 at 18:49

user3662273

524
4
10

Nope document.forms["name_of_form"].submit() is a perfectly valid method to submit the form and what you have mentioned is no way relevant to what I asked. – user1613360 Jun 05 '14 at 04:22

jQuery ajax post data with javascript submit form

1 Answers1