Mayo 29, 2013
estebanvalerioh
Drupal cuenta con el módulo File, el cual le permite a los usuarios cargar archivos y adjuntarlos a contenido y manipularlos si se cuenta el permiso adecuado. Este módulo se encarga de la validación de los archivos y del manejo de los mismos.
Además proporciona el código Javascript responsable de validar el archivo que se está cargando en cual entre otras cosas revisa la extensión del archivo y en caso de error muestra un mensaje del porqué se presento algún fallo como el siguiente:
Éste código puede ser sobrescrito para poder cambiar parte del comportamiento o cambiar los mensajes de error, esto lo logramos de la siguiente forma.
- Copiamos y pegamos el código Javascript.
Este código se encuentra en el archivo file.js y es parte de los módulos file del core de Drupal.
Drupal.file = Drupal.file || {
/**
* 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].
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.", {
// According to the specifications of HTML5, a file upload control
// should not reveal the real local path to the file that a user
// has selected. Some web browsers implement this restriction by
// replacing the local path with "C:\fakepath\", which can cause
// confusion by leaving the user thinking perhaps Drupal could not
// find the file because it messed up the file path. To avoid this
// confusion, therefore, we strip out the bogus fakepath string.
'%filename': this.value.replace('C:\\fakepath\\', ''),
'%extensions': extensionPattern.replace(/\|/g, ', ')
});
$(this).closest('div.form-managed-file').prepend('<div class="messages error file-upload-js-error">' + error + '</div>');
this.value = '';
return false;
}
}
},Lo que debemos hacer es copiar la parte del código que necesitamos y lo ponemos en un nuevo archivo javascript dentro de un módulo personalizado, de la siguiente forma:
(function($) {
// Re-writing file upload
Drupal.file = Drupal.file || {
/**
* 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].
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 file you tried to upload does not have an acceptable extension.");
$(this).closest('div.form-managed-file').prepend('<div class="messages error file-upload-js-error">' + error + '</div>');
this.value = '';
return false;
}
}
}
};
})(jQuery);El cambio que estoy haciendo es simplemente de cambiar el mensaje de error y remove comentarios en el código y este nueva función se ejecutara cuando valida la extensión a la hora de cargar un archivo.
- Probar el cambio.
Cuando se ha re-definido la función que procesas los archivos, solo debemos borrar el caché de Drupal, para que nuestro código sea reconocido y empiece a funcionar y podamos ver nuestra implementación.
Vemos a continuación una imagen de ejemplo de nuestro código funcionando:
Saludos.