0

I have a view with exposed filters and Ajax activated. I would like to validate my exposed filters values before my view is updated by the submit button. The following code works without Ajax, but when I activate this functionalitty it doesn't validate!

jQuery('FORM ID').submit(function () {
  jQuery('FILTER TEXTFIELD').val(MY VALIDATION);
  return true;
});

How can i capture the ajax execution and validate my values BEFORE the ajax call?

2 Answers 2

0

You have to capture the mousedown event on the submit / apply button, prevent submission using e.preventDefault(), validate and if everything is fine submit the form using $('#form-id').submit()

Update:

Here is a fully tested and working code:

(function ($) {
    Drupal.behaviors.ValidateAjaxForm = {
        attach : function (context, settings) {

            var $form = $("form#views-exposed-form-list", context); // ajax form selector, or better specify by class name
            var $submitButton = $('#edit-submit-list', $form); // ajax submit button selector, or better specify by class name

            // Use off to remove any existing submit handler
            $form
            .off('submit')
            .on('submit', function (e) {
                e.preventDefault();
                var $form = $(this);

                var valid = false;

                // Run some validation on $form object.
                // check conditions here and if all is fine declare valid = true

                // If vaild, trigger event on button
                if (valid) {
                    $form[0].submit();
                }

            });
        }
    };
}
    (jQuery));
2
  • Still not working when Ajax is turned on
    – xstean
    Commented Apr 13, 2016 at 19:47
  • @xstean kindly see my newest answer. Sorry I did not paid attention at first that ajax is enabled on the view.
    – W.M.
    Commented Apr 14, 2016 at 13:15
0

In order to make validation work in case ajax is enabled, do the following:

1) You have to apply this patch to /misc/ajax.js .. (should be committed to core in near future I expect)

2) Use this code to capture the submit event and to do validation before actual form submission:

(function ($) {
    Drupal.behaviors.ValidateAjaxForm = {
        attach : function (context, settings) {

            Drupal.ajax.prototype.beforeSubmit = function (form_values, element, options) {

                // First make sure that the Ajax event is triggered by the form to be validated
                if ($(element.context).is($("form#views-exposed-form-ID"))) { // relpace with form id

                    var isValid = true;

                    // Do validation work here
                    // if anything is wrong decalre isValid = false

                    return isValid;
                }
            };
        }
    };
}
    (jQuery));

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.