ForgeComponentes
es

Componentes

j-FileUploader

jComponent 20 · jcomponent@20 component Ejemplo cargado con jComponent 20

Un componente simple para cargar archivos. Admite imágenes con cambio de tamaño automático.

  • IMPORTANTE: en jComponent v20, el valor de opt.url debe tener el formato POST /url/

Configuración:

  • url {String} una dirección URL predeterminada para cargar

Métodos:

  • fileuploader/upload(opt) muestra un cuadro de diálogo de archivo
    • opt.url {String} importante URL donde se cargará la imagen
    • opt.callback(response, errors) {Function} una devolución de llamada importante
    • opt.multiple {Boolean} admite varios archivos (predeterminado: false)
    • opt.progress(percentage) {Función}
    • opt.accept {String} acepta tipo (predeterminado: */*)
    • opt.prefix {String} un prefijo de nombre <input name="file{0}" (predeterminado: file{0})
    • opt.files {FileList} opcional (si usa, por ejemplo, Arrastrar y soltar)
    • opt.data {Object} opcional, datos personalizados adicionales key_string:value_string
    • opt.width {Number} opcional, ancho de imagen
    • opt.height {Number} opcional, altura de imagen
    • opt.background {String} opcional, color de fondo definido en HEX o puede ser transparent
    • opt.keeporiginal {Boolean} opcional, evita el doble cambio de tamaño (predeterminado: false)
    • opt.onlylarger {Boolean} opcional, cambia el tamaño de las imágenes solo mayores que opt.width o opt.height
    • opt.base64 {String} opcional, puede contener un formato dataURI válido (requerido para completar opt.filename)
    • opt.filename {String} opcional, requerido con el campo opt.base64
    • opt.quality {Number} opcional, calidad JPEG predeterminada (predeterminada: 90)
    • NUEVO: opt.disproportionate {Boolean} utiliza opt.width o opt.height como valores máximos

Componentes amigables:

Este componente funciona con loading cuando se carga el archivo.

Úselo con <ui-component name="fileuploader">. Cuando el componente aún no está cargado, jComponent lo descarga en el primer uso desde la dirección en DEF.fallback (la CDN Componentator de forma predeterminada). Autor: Peter Širka. Fuente: repositorio de componentes Componentator, licencia MIT.

example.html
<ui-component name="fileuploader"></ui-component>
<div class="exec link" data-exec="upload">Upload</div>

<script>
	function upload() {

		var opt = {};

		opt.url = '/api/upload/';

		// jComponent v20:
		// opt.url = 'POST /api/upload/';

		// opt.multiple = true;
		// opt.accept = 'text/*';

		opt.callback = function(response, err) {
			console.log(response, err);
		};
		opt.progress = function(percentage) {
			console.log(percentage);
		};

		SETTER('fileuploader/upload', opt);
	}
</script>