Disable submit button order

Question

Here is a snippet of my code

   <?php echo apply_filters( 'woocommerce_order_button_html', '<input type="submit" class="button alt" name="woocommerce_checkout_place_order" id="place_order" value="' . esc_attr( $order_button_text ) . '" data-value="' . esc_attr( $order_button_text ) . '" />' ); ?>

       <?php if ( wc_get_page_id( 'terms' ) > 0 && apply_filters( 'woocommerce_checkout_show_terms', true ) ) : ?>
                <p class="form-row terms">
                    <label for="terms" class="checkbox"><?php printf( __( 'I&rsquo;ve read and accept the <a href="%s" target="_blank">terms &amp; conditions</a>', 'yit' ), esc_url( get_permalink( wc_get_page_id( 'terms' ) ) ) ); ?></label>
                    <input type="checkbox" class="input-checkbox" name="terms" <?php checked( apply_filters( 'woocommerce_terms_is_checked_default', isset( $_POST['terms'] ) ), true ); ?> id="terms" />
                </p>
                <p class="subscribe">
                Subscribe to get discounts, coupons and tips
                <?php include "/home/edcthings/public_html/wp-content/plugins/yith-essential-kit-for-woocommerce-1/modules/yith-woocommerce-mailchimp/templates/mailchimp-subscription-checkbox.php" ?>
                </p>
            <?php endif; ?>

            <?php do_action( 'woocommerce_review_order_after_submit' ); ?>

        </div>

        <div class="clear"></div>

I need to disable the submit button but still allow it to process. I've found the javascript that should work with this form but it doesn't.

$(function(){
 $(".button").click(function () {
   $(".button").attr("disabled", true);
   $('#cart-table').submit();
 });
 });

Receive a console error "Uncaught TypeError: $ is not a function"

Edit: I figured out why the errors were occurring. I changed the code to function correct in WordPress...

    <script type="text/javascript" charset="utf-8">
    jQuery(document).ready(function($){
      $(".button").click(function () {
      $(".button").attr("disabled", true);
      $('#checkout').submit();
      });
    });
    </script>

This makes the button disable but still doesn't allow the form to submit

Answer 1

Fixed the issue. Was calling the incorrect IDs. Below is the code I used for anybody else wanting to achieve the same outcome.

<script type="text/javascript" charset="utf-8">
jQuery(document).ready(function($){
    $(".button#place_order").click(function () {
       $(".button#place_order").attr("disabled", true);
       $('.checkout').submit();
     });
});
</script>

Answer 2

Are you targeting the right class there? Not sure if that's just example code. But I can't see that class on your button.

Also, it should be attr("disabled", "disabled") or just the attribute disabled. It doesn't need a value for HTML5.