diff --git a/modules/file/file.js b/modules/file/file.js index 0f0f4370823875266d81b3e22a72d2bca276043a..15629df5bd9bf74a16b051eaaaa0e1f98c4d6714 100644 --- a/modules/file/file.js +++ b/modules/file/file.js @@ -15,11 +15,20 @@ * Attach behaviors to managed file element upload fields. */ Drupal.behaviors.fileValidateAutoAttach = { - attach: function (context) { - $('div.form-managed-file input.form-file[accept]', context).bind('change', Drupal.file.validateExtension); + attach: function (context, settings) { + if (settings.file && settings.file.elements) { + $.each(settings.file.elements, function(selector) { + var extensions = settings.file.elements[selector]; + $(selector, context).bind('change', {extensions: extensions}, Drupal.file.validateExtension); + }); + } }, - detach: function (context) { - $('div.form-managed-file input.form-file[accept]', context).unbind('change', Drupal.file.validateExtension); + detach: function (context, settings) { + if (settings.file && settings.file.elements) { + $.each(settings.file.elements, function(selector) { + $(selector, context).unbind('change', Drupal.file.validateExtension); + }); + } } }; @@ -54,20 +63,20 @@ Drupal.behaviors.filePreviewLinks = { */ Drupal.file = Drupal.file || { /** - * Client-side file input validation based on the HTML "accept" attribute. + * Client-side file input validation of file extensions. */ validateExtension: function (event) { // Remove any previous errors. $('.file-upload-js-error').remove(); - // Add client side validation for the input[type=file] accept attribute. - var accept = this.accept.replace(/,\s*/g, '|'); - if (accept.length > 1 && this.value.length > 0) { - var acceptableMatch = new RegExp('\\.(' + accept + ')$', 'gi'); + // Add client side validation for the input[type=file]. + var extensionPattern = event.data.extensions.replace(/,\s*/g, '|'); + if (extensionPattern.length > 1 && this.value.length > 0) { + var acceptableMatch = new RegExp('\\.(' + extensionPattern + ')$', 'gi'); if (!acceptableMatch.test(this.value)) { var error = Drupal.t("The selected file %filename cannot be uploaded. Only files with the following extensions are allowed: %extensions.", { '%filename': this.value, - '%extensions': accept.replace(/\|/g, ', ') + '%extensions': extensionPattern.replace(/\|/g, ', ') }); $(this).parents('div.form-managed-file').prepend('<div class="messages error file-upload-js-error">' + error + '</div>'); this.value = ''; diff --git a/modules/file/file.module b/modules/file/file.module index 8b8b9c9246b5a00f430b83470340831692ee2019..df0d11e34c3bafae1e5102ed3057a9141eef56a6 100644 --- a/modules/file/file.module +++ b/modules/file/file.module @@ -442,10 +442,15 @@ function file_managed_file_process($element, &$form_state, $form) { ); } - // The "accept" attribute is valid XHTML, but not enforced in browsers. - // We use it for our own purposes in our JavaScript validation. + // Add the extension list to the page as JavaScript settings. if (isset($element['#upload_validators']['file_validate_extensions'][0])) { - $element['upload']['#attributes']['accept'] = implode(',', array_filter(explode(' ', $element['#upload_validators']['file_validate_extensions'][0]))); + $extension_list = implode(',', array_filter(explode(' ', $element['#upload_validators']['file_validate_extensions'][0]))); + $element['upload']['#attached']['js'] = array( + array( + 'type' => 'setting', + 'data' => array('file' => array('elements' => array('#' . $element['#id'] . '-upload' => $extension_list))) + ) + ); } // Prefix and suffix used for AJAX replacement.