1

Buen dia a todos. Me pueden ayudar de favor a encontrar esta solucion: No puedo enviar saltos de linea desde un formulario que pasa por javascript y al final a whatsapp. He intentado muchas maneras con \n y los saltos de javascript pero no logro hacerlo.

Aqui paso los datos de la variable que se muestra antes de ser enviado a whatsapp en un formulario que es la vista previa

<div class="box-input">
       <     <span style = "color: #9b9b9b;">Pedido</span>
             <input name="pedido" id="pedido" type="text" value='<?php echo $productoo;?>' readonly="readonly" required>
          </div>

Aqui paso el pedido a whatsapp


    formulario.addEventListener('submit', (event) => {
        event.preventDefault()
        buttonSubmit.innerHTML = '<i class="fas fa-circle-notch fa-spin"></i>'
        buttonSubmit.disabled = true
        setTimeout(() => `introducir el código aquí`{
            let nombre = document.querySelector('#nombre').value
            let apellidos = document.querySelector('#apellidos').value
            let email = document.querySelector('#email').value
            var pedido = document.querySelector('#pedido').value
            let total = document.querySelector('#total').value
            let envio = document.querySelector('#envio').value
            let mensaje = 'send?phone=' + telefono + '&text=*_Pedido_*%0A*Nombre:*%0A' + nombre + '%0A*Apellido:*%0A' + apellidos + '%0A*Direccion:*%0A' + email + '%0A*Pedido:*%0A' + pedido + '%0A*Costo de envio:*%0A' + envio + '%0A*Total:*%0A' + total + ''
            if(isMobile()) {
                window.open(urlMobile + mensaje, '_blank')
            }else{
                window.open(urlDesktop + mensaje, '_blank')
            }
            buttonSubmit.innerHTML = '<i class="fab fa-whatsapp"></i> Enviar WhatsApp'
            buttonSubmit.disabled = false
        }, 3000);
    });

El resultado que envia mi codigo es este

Resultado deseado con los saltos de linea

El resultado que envia mi codigo es este

Resultado deseado con los saltos de linea

3
  • por favo mira Cómo preguntar.. tu codigo y errores siempre deben ir como texto
    – gbianchi
    Commented el 28 ago. 2020 a las 15:20
  • Muchas gracias. lo voy a corregir Commented el 28 ago. 2020 a las 15:21
  • Listo, espero que se encuentre mas entendible Commented el 28 ago. 2020 a las 15:37

1 respuesta 1

2

Como te puedes fijar en la URL, %0A puede usarse para generar un caracter de salto de linea (0x0A). Por tanto si el pedido tiene saltos de linea puedes ajustar la siguiente linea:

var pedido = document.querySelector('#pedido').value.replace(/\n/g,'%0A');

Lo mismo para cualquier variable que desees enviar con saltos de linea.

Ahora, una solución aun mas general (no solo saltos de linea sino cualquier caracter especial) es usar encodeURI():

var pedido = encodeURI(document.querySelector('#pedido').value);

https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/encodeURI

8
  • 1
    Muchas gracias utilic-e replaceAll ya que solo tomaba el primer \n Commented el 28 ago. 2020 a las 16:01
  • 1
    Tener cuidado con replaceAll() ya que es una implementacion reciente y no esta disponible aun en todos los browsers. Si utilizas /\n/g deberia tener el mismo efecto que replaceAll (modificador /g en la expresion regular reemplaza en todos las ocurrencias) caniuse.com/#search=replaceAll
    – F.Igor
    Commented el 28 ago. 2020 a las 16:50
  • Me genera la misma problematica si no utilizo replaceAll(), no funciona correctamente la expresion. solo desaparece \n Commented el 28 ago. 2020 a las 17:05
  • @FrankMartinez, creo que es más adecuado el uso de encodeURI, porque aplica a todos los caracteres especiales: espacios, saltos de línea, caracteres con tilde, etc.
    – Triby
    Commented el 28 ago. 2020 a las 17:05
  • @Triby De igual forma encodeURI no soluciona el problema. Commented el 28 ago. 2020 a las 17:07

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.