Post a form using Javascript

Question

I have following form tag:

<form id="Form1" action="https://www.example.com/" method="post" runat="server">
            <asp:HiddenField ID="p" runat="server" Value="1" />
            <asp:HiddenField ID="msg" runat="server" Value="2"/>
            <asp:HiddenField ID="cha" runat="server" Value="3"/>
            <asp:HiddenField ID="lang" runat="server" Value="4"/>
            <asp:HiddenField ID="number" runat="server" Value="5"/>
            <asp:HiddenField ID="amo" runat="server" Value="6"/>
            <asp:HiddenField ID="cu" runat="server" Value="7"/>
            <asp:HiddenField ID="co" runat="server" Value="8"/>
            <asp:HiddenField ID="cl" runat="server" Value="9"/>
            <asp:HiddenField ID="crl" runat="server" Value="10"/>
            <asp:HiddenField ID="sature" runat="server" Value="11"/>
            <asp:HiddenField ID="mk" runat="server"/>
    <input type="submit" name="submit" value="Go" />
</form>

I would like to trigger the post action using JavaScript while page is loading!

I used following Javascript code to the Head tag to do so, but it is not working.

<script type="text/javascript">
    $(document).ready(function () {
        var myForm = document.getElementById('Form1');
        myForm.submit();
    });

</script>

Any suggestion?????

Edit1 : I tried provided solutions in this article but wasn't solving my problem.

Edit2 : following scripts are added to form. (Head Tag). are they sufficient for this?

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"></script>
    <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js" type="text/javascript"></script>

Seems suspicious. There must be a better way to accomplish what you want. — Tim Seguine
– Tim Seguine, Commented Dec 18, 2013 at 22:41
As you already use jquery you can simply write $('#Form1').submit(); Well have u included jquery? :-P — Markus Kottländer
– Markus Kottländer, Commented Dec 18, 2013 at 22:42
why do you send the user back content for the user to submit rather than submitting it for them from your server? — user400654
– user400654, Commented Dec 18, 2013 at 22:42
Define "it is not working". Does the form not get submitted, or does it get submitted without any data? Form controls must have a name to be successful. — RobG
– RobG, Commented Dec 18, 2013 at 22:45

zachallia · Accepted Answer · 2013-12-18 23:36:07Z

4

To submit the form while the page is loading, put the script tag immediately after the form and do not wrap it in a document.ready (This answer is assuming you have jquery included in the head of the page, since you had it in your question)

<form id="Form1" action="https://www.example.com/" method="post" runat="server">
        <asp:HiddenField ID="p" runat="server" Value="1" />
        <asp:HiddenField ID="msg" runat="server" Value="2"/>
        <asp:HiddenField ID="cha" runat="server" Value="3"/>
        <asp:HiddenField ID="lang" runat="server" Value="4"/>
        <asp:HiddenField ID="number" runat="server" Value="5"/>
        <asp:HiddenField ID="amo" runat="server" Value="6"/>
        <asp:HiddenField ID="cu" runat="server" Value="7"/>
        <asp:HiddenField ID="co" runat="server" Value="8"/>
        <asp:HiddenField ID="cl" runat="server" Value="9"/>
        <asp:HiddenField ID="crl" runat="server" Value="10"/>
        <asp:HiddenField ID="sature" runat="server" Value="11"/>
        <asp:HiddenField ID="mk" runat="server"/>
        <input type="submit" name="submit" value="Go" />
</form>

<script type="text/javascript">
    $('#Form1').submit();
</script>

edited Dec 18, 2013 at 23:36

answered Dec 18, 2013 at 22:44

zachallia

1,48512 silver badges16 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

amir moradifard Over a year ago

Thanks Zachallia, I tried this too but again nothing changed. I have provided the included script items in page. are they correct?

RobG Over a year ago

@amirmoradifard—You can remove the dependency on jQuery altogether using document.forms['Form1'].submit();. You don't need jQuerUI.

KingKongFrog · Accepted Answer · 2013-12-18 22:42:25Z

1

<script type="text/javascript">
    $(document).ready(function () {
        $('#Form1').submit();
    });

</script>

answered Dec 18, 2013 at 22:42

KingKongFrog

14.5k22 gold badges78 silver badges134 bronze badges

Comments

abc123 · Accepted Answer · 2013-12-18 22:45:13Z

1

Using jQuery, do this on a $('#Form1').submit(function(){ \\HERE });

$.post("https://www.example.com/", $("#Form1").serialize(),  function() {
    alert("success");
}));

So in total:

\\Event that occurs when DOM is ready
$(document).ready(function () {
    \\Event binding that occurs when the element with ID `Form1` is submitted 
    $('#Form1').submit(function(){
        \\Calls the POST function in jQuery with the serialized form data
        $.post("https://www.example.com/", $("#Form1").serialize(),  function() {
            alert("success");
        })); 
    });
});

answered Dec 18, 2013 at 22:45

abc123

19k7 gold badges55 silver badges84 bronze badges

1 Comment

amir moradifard Over a year ago

Thanks for the response. This is not working as well. I think the problem should be from somewhere else!

oded · Accepted Answer · 2013-12-18 22:46:47Z

1

if you are using jquery you can do this:

<script type="text/javascript">
    $(document).ready(function () {
        $('#Form1').submit();
    });

</script>

answered Dec 18, 2013 at 22:46

oded

1212 bronze badges

Collectives™ on Stack Overflow

Post a form using Javascript

4 Answers 4

2 Comments

Comments

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

2 Comments

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related