Disable Submit Button Until Terms And Conditions Are Accepted Using jQuery

by Bill Beckelman 1. September 2008 21:12

Often times when signing up for a new service or such you must accept the site's terms and conditions. Until you explicitly check that you agree, you are not allowed to submit the web page. Here is an easy way to do this using jQuery. You just have to change some attributes on your button to enable/disable. For more info see the jQuery documentation. Note that the user will still be able to submit the page if JavaScript is disabled.

Demo | Download

Disabled:

image

Enabled:

image

JavaScript Disabled:

image

jQuery:

        $(document).ready(function() {
            $("#ButtonAcceptTerms").attr("disabled", "disabled");

            $("#CheckBoxTerms").click(function() {
                var checked_status = this.checked;
                if (checked_status == true) {
                    $("#ButtonAcceptTerms").removeAttr("disabled");
                }
                else {
                    $("#ButtonAcceptTerms").attr("disabled", "disabled");
                }
            });
        });

ASP.NET:

        <asp:CheckBox ID="CheckBoxTerms" runat="server" />
        I accept the terms and conditions.
        <div class="submitDiv">
            <asp:Button ID="ButtonAcceptTerms" runat="server" Text="Submit" />
        </div>

 

Hope this helps someone :)

kick it on DotNetKicks.com     

Tags:

jQuery

Comments


About Me

I live and work in Salt Lake City, Utah. My background is in aviation. I have a degree in Aeronautical Science from Embry-Riddle Aeronautical University in Prescott, AZ. I have worked as a commercial airline pilot and most recently as a technical advisor for a charter airline.