1

I've got a custom plugin with a metabox and dynamic form (the user can ask for more elements of the form), with jQuery Validation plugin working great. The problem is when the validation comes back false (i.e. the form doesn't pass the validation checks) the Save Draft button and its throbber don't get reset. The user can still click the Save Draft button, but it's kind of messy: it doesn't show its true state.

So, how do I reset the Save Draft button, and turn off the throbber?

UPDATE: Here's the code. The form:

<div style="" class="ru-data" id="ru-data-1">
    <hr>    
    <div class="ru-form" id="ru-form-1">
        <div>
            <label for="ru-title-1">Title</label>
            <input type="text" ru-title="true" value="" name="ru-title-1">
        </div>
        <div>
            <label for="ru-lineup-1">Lineup</label>
            <span role="status" aria-live="polite" class="ui-helper-hidden-accessible"></span><input type="text" ru-lineup="true" class="ru-lineup ui-autocomplete-input" value="" id="ru-lineup-1" name="ru-lineup-1" autocomplete="off">
            <input type="hidden" value="" id="ru-lineupid-1" name="ru-lineupid-1">
            <span class="ru-lineupclr" id="ru-lineupclr-1">
                <span class="wp-bootstrap icon-remove"></span>
            </span>
        </div>
        <div>
            <label for="ru-seemore-1">See More Label</label>
            <input type="text" ru-seemore-label="true" value="" name="ru-seemore-1">
        </div>
        <div>
            <label for="ru-seemorelink-1">See More Link</label>
            <input type="text" ru-seemore-link="true" class="url" value="" name="ru-seemorelink-1" id="ru-seemorelink-1">
        </div>
    </div>
    <div class="ru-controls">
        <input type="button" value="Delete" class="ru-delete" name="ru-delete-1" id="ru-delete-1" disabled="disabled">
    <input type="button" value="More Lineups" id="ru-morebtn"></div>
</div>

And here's part of the validation code; it handles just the first of the four fields, but it's enough to give the idea. The others are pretty much the same sort of thing.

// Add validation to form
$('#post').validate();
$.validator.addMethod('ru-title'
    , function(value, element, param) {
        var counter = $(element).attr('name');
        counter = counter.replace('ru-title-', '');
        var title = $('input[name=ru-title-' + counter + ']').val();
        var id = $('#ru-lineupid-' + counter).val();
        var res;
        if (counter == 1) {
            if ((title == '' && id == '') || (title > '')) {
                res = true;
            } else {
                res = false;
            }
        } else if (title == '') {
            res = false;
        } else {
            res = true;
        }
        return res;
    }
    , 'Title is required.'
);
  • Post the relevant code please. – s_ha_dum May 11 '14 at 16:57

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.