0

¿Como podria hacer el numero consecutivo en un codigo de barras, automaticamente, cada vez que le doy al boton ? Tengo que crear un numero consecutivo de 6 cifras en un codigo de barras
He usado JsBarcode y en data-text me tiene que salir un numero de 6 cifras, pero empezando por orden, es decir: 000001,000002,000003,000004.
Cada vez que le doy a un boton me tiene que generar un numero nuevo de 6 cifras.

<button id="guardar" type="button" onClick="myFunction();" class=".codigo">Generar Codigo</button>

Al boton le he medito una funcion para que se me ejecute al darle click

function myFunction() {
       JsBarcode(".codigo").init();
}

Y este es mi codigo de barras

<img data-value="12345" data-text="12-563" class="codigo"/>
2
  • Y el código de la función? Commented el 26 abr. 2021 a las 13:45
  • Y cual es tu pregunta? Commented el 26 abr. 2021 a las 13:49

1 respuesta 1

0

Para llenar con ceros el número puedes apoyarte con String.prototype.padStart(). Recuerda que es experimental por lo que si no te funciona deberás crear una función para tal fin.

Para el caso de los atributos data-*, bastará con acceder al dataset del elemento y establecer la propiedad que deseas.

Ahora para generar el barcode, según la documentación, es tan sencillo como pasarle la cadena de texto que quieras que contenga. Antes de hacer el proceso de generar el string con los ceros y setearlo al barcode, debes incrementar el número razón de uno.

Nota: Este método reiniciará el número cada vez que recargues la página, si quieres persistir el número deberás buscar otro método.

let number = 0;

JsBarcode("#barcode").init();


function myFunction() {
  const barcode = document.getElementById('barcode');
  const barcodeContainer = document.getElementById('barcodeContainer');
  
  number++;
  const numberCode = String(number).padStart(6, '0');

  barcodeContainer.classList.remove('hidden');
  barcodeContainer.classList.add('visible');

  barcode.dataset.value = numberCode;
  JsBarcode("#barcode", numberCode);
}
.visible {
  display: block;
}

.hidden {
  display: none;
}
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/JsBarcode.all.min.js"></script>
<button id="guardar" type="button" onClick="myFunction()" class=".codigo">Generar Codigo</button>
<div id="barcodeContainer" class="hidden"><svg id="barcode"></svg></div>

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.