Question

I am trying to enable the next tab at the end of the function below.

Here is my function (UPDATED)

var $signup = $('#signup-content').tabs({disabled: [1,2],
  show: function(event, ui) {
        // Validates Form on Slide # 1
        $("#createAccount").validate({
        meta: "validate",
        errorElement: "em",
                errorClass: "error",
        validClass: "success",
        highlight: function(element, errorClass, validClass) {
            $(element).closest("div.required").removeClass(validClass);
            $(element).closest("div.required").addClass(errorClass);
            $(element).addClass(errorClass);
        },
        unhighlight: function(element, errorClass, validClass) {
            $(element).closest("div.required").removeClass(errorClass);
            $(element).closest("div.required").addClass(validClass);
            $(element).removeClass(errorClass);
        },
        errorPlacement: function(error, element) {
            if (element.attr("name") == "month"
                 || element.attr("name") == "day"
                 || element.attr("name") == "year")
             error.insertAfter("#year");
            else
            error.addClass("hide");
        },
        debug:true,
                groups: {birthday: "month day year"
        },
        rules: {
            firstname:{required:true},
            lastname:{required:true},
            email: {required: true, email: true},
            confirm_email: {required: true, equalTo: "#email"},
            password:{required: true},
            confirm_password:{required: true,equalTo: "#password"},
            zipcode: {required:true, min:5},
            month:{required:true},
            day:{required:true},
            year:{required:true},
            gender:{required:true},
            agree:{required:true}
        },
        messages: {
        month: {required: "Month Is Missing"},
        day: {required: "Day Is Missing"},
        year: {required: "Year Is Missing"}

        },
               submitHandler: function(form) {
            $(form).ajaxSubmit({
             beforeSubmit:  function showRequest(formData, jqForm, options) {
                         var queryString = $.param(formData);
                         alert('About to submit: \n\n' + queryString);
                         return true;
               },
               success: function showResponse(formData) {
                       $('html, body').animate({scrollTop:'0px'}, 500);
                       $signup.tabs('option', 'enabled', [1]); 
                       $signup.tabs('select', 1); // Go To Slide # 2
                       $('#message-container').addClass("notice").append('<h3>Your Account Has Been Created!</h3><a href="javascript:;" id="close"><img src="/assets/images/close.png" alt="Close" title="Close"/></a>');
                       $('#message-container').fadeIn(1200, function(){
                       $('#close').click(function(){$('#message-container').fadeOut(1200);});});
                       return false;}});}}); 

Answer 1

According to the instructions, you can’t use:

$signup.tabs('option', 'enabled', [1]);

but instead use:

$signup.data('disabled.tabs', []);

what that does is clear the list of disabled tabs.