2

Hola buenos días tengo un problema a la hora que le quiero pasar como parámetro mi variable a la función. Les anexo mi código.

Código

var fruta = "hola";

var html = '';
                          html += "<div class='card direct-chat direct-chat-primary'>"+
                            "<div class='card-header'>"+
                              "<h3 class='card-title'>Comentarios</h3>"+
                            "</div>"+
                            "<div class='card-body'>"+
                              "<div class='direct-chat-messages'>"+

                                comentarios+

                              "</div>"+
                            "</div>"+

                            "<div class='card-footer'>"+
                              "<form>"+
                                "<div class='input-group'>"+
                                  "<input type='text' id='form-input-comentario' name='message' placeholder='Comentario ...' class='form-control'>"+
                                  "<span class='input-group-append'>"+
                                    "<button type='button' class='btn btn-primary' onclick='set_comentario_ajax("+frutas+");'>Enviar</button>"+
                                  "</span>"+
                                "</div>"+
                              "</form>"+
                            "</div>"+
                          "</div>"+

                          "<div class='custom-file'>"+
                            "<input type='file' class='custom-file-input' id='customFile'>"+
                            "<label class='custom-file-label' for='customFile'>Seleccione</label>"+
                          "</div>";
                          $('#form-ticket-comentarios').html(html); 

Función que quiero llamar

function set_comentario_ajax(data){
  var porId = document.getElementById("form-input-comentario").value;
  alert(porId);
  console.log(data);
}

Error

ReferenceError: hola is not defined Tickets:1:1

Yo supongo que estoy concatenándole mal mi variable “frutas” como parámetro a la función

3 respuestas 3

1

Evita concatenar contenido, siempre suele ser origen de errores como el que tienes ahora, en su lugar, usa plantillas de texto, encerrando el contenido entre acentos graves (backticks en inglés) ` y, cada que necesites incluir una variable solo necesitas ${nombre_de_variable}

var fruta = 'hola';
var comentarios = '<p>Comentario 1</p><p>Comentario 2</p><p>Comentario 3</p>';

var html = "";
                          html += `<div class="card direct-chat direct-chat-primary">
                            <div class="card-header">
                              <h3 class="card-title">Comentarios</h3>
                            </div>
                            <div class="card-body">
                              <div class="direct-chat-messages">

                                ${comentarios}

                              </div>
                            </div>

                            <div class="card-footer">
                              <form>
                                <div class="input-group">
                                  <input type="text" id="form-input-comentario" name="message" placeholder="Comentario ..." class="form-control">
                                  <span class="input-group-append">
                                    <button type="button" class="btn btn-primary" onclick="set_comentario_ajax('${fruta}');">Enviar</button>
                                  </span>
                                </div>
                              </form>
                            </div>
                          </div>

                          <div class="custom-file">
                            <input type="file" class="custom-file-input" id="customFile">
                            <label class="custom-file-label" for="customFile">Seleccione</label>
                          </div>`;
                          $("#form-ticket-comentarios").html(html);

function set_comentario_ajax(valor) {
    console.log(valor);
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="form-ticket-comentarios"></div>

7
  • me sigue marcando aun el mismmo error ReferenceError: fruta is not defined
    – Javier fr
    Commented el 5 jun. 2020 a las 16:30
  • Al inicio de tu pregunta tienes var fruta = "hola";, lo que me hace pensar que no pusiste aquí tu código real y así va a ser difícil poder ayudarte. Por favor edita la pregunta y agrega el código donde obtienes el valor de fruta.
    – Triby
    Commented el 5 jun. 2020 a las 16:32
  • si es mi código real y solo aplique los cambios que me dijiste
    – Javier fr
    Commented el 5 jun. 2020 a las 16:34
  • Si lo hiciste tal cual no debería dar error. ¿Ejecutaste el fragmento de código? Ahí no se ven errores. Entonces habría que ver cómo y dónde pusiste todo, tal vez está en diferente contexto (scope).
    – Triby
    Commented el 5 jun. 2020 a las 16:36
  • 1
    Probablemente es en la función donde no puedes acceder a la variable. Actualicé la respuesta.
    – Triby
    Commented el 5 jun. 2020 a las 16:43
1

El problema es que estas mandando una variable que en el html no existe, asi que deberías agregar unas comillas,

Para que se especifique desde JavaScript como string

También te recomiendo utilizar ${} dentro de donde quieras insertar una variable, debe ir dentro de estas comillas (``)

  `<button type="button" class="btn btn-primary" onclick="set_comentario_ajax('${fruta}')">Enviar</button>`

No es necesario el uso de ";" en onclick

3
  • muchas gracias ya quedo
    – Javier fr
    Commented el 5 jun. 2020 a las 16:42
  • Espero haberte ayudado Commented el 5 jun. 2020 a las 16:43
  • me ayudaste bastante. Saludos y buen día
    – Javier fr
    Commented el 5 jun. 2020 a las 16:43
0

Intenta agregar el parámetro con comillas sencillas:

    html += "<div class='card direct-chat direct-chat-primary'>"+
  "<div class='card-header'>"+
    "<h3 class='card-title'>Comentarios</h3>"+
  "</div>"+
  "<div class='card-body'>"+
    "<div class='direct-chat-messages'>"+

      comentarios+

    "</div>"+
  "</div>"+

  "<div class='card-footer'>"+
    "<form>"+
      "<div class='input-group'>"+
        "<input type='text' id='form-input-comentario' name='message' placeholder='Comentario ...' class='form-control'>"+
        "<span class='input-group-append'>"+
          "<button type='button' class='btn btn-primary' onclick='set_comentario_ajax(\'"+frutas+"\');'>Enviar</button>"+
        "</span>"+
      "</div>"+
    "</form>"+
  "</div>"+
"</div>"+

"<div class='custom-file'>"+
  "<input type='file' class='custom-file-input' id='customFile'>"+
  "<label class='custom-file-label' for='customFile'>Seleccione</label>"+
"</div>";
3
  • me manda el siguiente error SyntaxError: expected expression, got '}'
    – Javier fr
    Commented el 5 jun. 2020 a las 16:03
  • He editado la respuesta, agregando el contenido completo de la variable html para que puedas comparar.
    – Andnv
    Commented el 5 jun. 2020 a las 16:16
  • aun me sigue marcando SyntaxError: expected expression, got '}'
    – Javier fr
    Commented el 5 jun. 2020 a las 16:31

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.