title: Gravity Forms add onClick action to submit button to show message
body: <p>So I have the gravity forms in a popup modal called <code>#learn-more</code>. But when the user clicks submit on the Gravity Forms form, the modal closes without any visible message (if the modal button is clicked again then the complete message is shown). I thought about seeing if I can prevent the modal from closing onclick but I prefer to save the user a click by showing a message outside the modal.</p>
  <p>The original button looks like this:</p>
  <pre><code>&lt;input type=&quot;submit&quot; id=&quot;gform_submit_button_7&quot; class=&quot;gform_button button&quot; value=&quot;Submit&quot; onclick=&quot;if(window[&amp;quot;gf_submitting_7&amp;quot;]){return false;}  window[&amp;quot;gf_submitting_7&amp;quot;]=true;  &quot; onkeypress=&quot;if( event.keyCode == 13 ){ if(window[&amp;quot;gf_submitting_7&amp;quot;]){return false;} window[&amp;quot;gf_submitting_7&amp;quot;]=true;  jQuery(&amp;quot;#gform_7&amp;quot;).trigger(&amp;quot;submit&amp;quot;,[true]); }&quot;&gt;
  </code></pre>
  <p>I'm adding <code>onclick=&quot;show_message() ....</code> as this</p>
  <pre><code>    add_filter( 'gform_submit_button_7', 'form_submit_button', 10, 2 );
      function form_submit_button( $button, $form ) {
          return &quot;&lt;input type=&quot;submit&quot; id=&quot;gform_submit_button_7&quot; class=&quot;gform_button button&quot; value=&quot;Submit&quot; 
             onclick=&quot;show_message() if(window[&amp;quot;gf_submitting_7&amp;quot;]){return false;}  window[&amp;quot;gf_submitting_7&amp;quot;]=true; &quot; 
             onkeypress=&quot;if( event.keyCode == 13 ){ if(window[&amp;quot;gf_submitting_7&amp;quot;]){return false;} window[&amp;quot;gf_submitting_7&amp;quot;]=true;  
             jQuery(&amp;quot;#gform_7&amp;quot;).trigger(&amp;quot;submit&amp;quot;,[true]); }&quot;&gt;&quot;;
      }
  </code></pre>
  <p>But nothing changes when I inspect the element. Is there something I am missing or a way to force the function to happen similar to the <code>!important</code> tag? I Just for good measure here is the <code>show_message()</code> function:</p>
  <pre><code>    function show_message() {
        var x = document.getElementById(&quot;confirm_message&quot;);
        if (x.style.display === &quot;none&quot;) {
          x.style.display = &quot;block&quot;;
        } else {
          x.style.display = &quot;none&quot;;
        }
      }
  </code></pre>
  <p>I just really want some sort of confirmation message to show after the form is filled, so if you see an easier way I'd love to know.</p>