4 {{ upvoteCount | shortNum }}
4 {{ upvoteCount | shortNum }}

jQuery help binding a button

by Anomale
3 replies
hello I need to do the following. can someone help walk me through how to do it. I am fairly new to coding.

You can use jQuery to submit the form when your button is clicked, either add the following to your button onclick attribute or wrap it in a click handler ( .click() | jQuery API Documentation ) bound to your button
jQuery('‪#‎gform_13‬').submit();

backdrop... I have a wordpress site with gravity forms installed on the page I have a hidden form and want to submit the form when a CTA is clicked. currently my CTA is an image that redirects to a checkout page so I need to configure that image to submit the form by applying the above to it.

thanks
#binding #button #jquery
  • Profile picture of the author mikea12
    So if I understand you want to submit a form when the image is clicked?

    It's hard to fully understand what you mean without seeing code, but if you want to submit a form by clicking an image, here is a sample.

    EDIT: I made a mistake it's more like this http://jsfiddle.net/vqtkzg3j/1/

    HTML:

    Code:
    <form method="POST" action=''>
    <button type="submit">
        <img src="http://33.media.tumblr.com/0da1e786ac7997b82b072c30b32092ca/tumblr_naj3n71TcT1st5lhmo1_1280.jpg" />
    </button>
</form>
    jQuery
    Code:
    $('button').submit(function (e) {
    var postData = $(this).serializeArray();
    var formURL = $(this).attr("action");
    $.ajax({
        url: formURL,
        type: "POST",
        data: postData,
        success: function (data, textStatus, jqXHR) {
            //data: return data from server
        },
        error: function (jqXHR, textStatus, errorThrown) {
            alert('error)   
        }
    });
    e.preventDefault(); //STOP default action
    e.unbind(); //unbind. to stop multiple form submit.
});
    Obviously there would need to be tweaks and such, but this should be a good start I think. If I am way off just let me know, if I can better understand I am sure I can help!

    PS in the fiddle you're going to get an error, but you see it does make a POST request, you would need to see what URL gravity forms submit's to.

    This is what I took from your post. You have a CTA (call to action) which is an image, when the user clicks the image you want to send data along with it? Then when the data returns with success you then want to redirect to a checkout page?
    {{ DiscussionBoard.errors[9519783].message }}
  • Profile picture of the author pinkwhale
    Banned
    HI,its good thanks for this code.i have no knowledge about jquery.we also binding a button by using html.
    {{ DiscussionBoard.errors[9635171].message }}
    • Profile picture of the author mikea12
      Originally Posted by pinkwhale View Post

      HI,its good thanks for this code.i have no knowledge about jquery.we also binding a button by using html.
      PM me if you still need help.
      {{ DiscussionBoard.errors[9645156].message }}

Trending Topics