-1

Hola buenas estoy intentado crear unos botones que hagan show y hide según la categoría pero tengo algún error y no funciona.

Este es el for que monta los botones:

 for (var i = 0; i < data.length; i++) {

                var categoria = data[i].NombreCategoria;
                if (categoria != null) {
                    categoria = categoria.split(" ").join("");
                }
                else {
                    categoria = "null";
                    data[i].NombreCategoria = "Sin categoría";
                }
                $("#ContenedorConvenios").append(""
                    + "<button class='btn btn-eco' onclick='prueba(" + categoria.toString() + ");' id='" + categoria + "'>" + data[i].NombreCategoria + "</button>"
                    + "");
                console.log("Hola" +categoria);

            }

Este es el código para los toggle:

function prueba(cat) {
    console.log("adios" + cat);
    $('#'+cat).on('click', function () {
        $('.' +cat).toggle()
    });
}

y esto es lo que me devuelve el console log:

 adios[object HTMLButtonElement] jquery-1.11.1.min.js:2 Uncaught Error:
 Syntax error, unrecognized expression: #[object HTMLButtonElement]
     at Function.fb.error (jquery-1.11.1.min.js:2)
     at fb.tokenize (jquery-1.11.1.min.js:2)
     at fb.select (jquery-1.11.1.min.js:2)
     at Function.fb [as find] (jquery-1.11.1.min.js:2)
     at m.fn.init.find (jquery-1.11.1.min.js:2)
     at m.fn.init (jquery-1.11.1.min.js:2)
     at m (jquery-1.11.1.min.js:2)
     at prueba (custom.js:195)
     at HTMLButtonElement.onclick (acuerdos-comerciales.html:1)

adios[object HTMLButtonElement] quiere decir que recoge todo el button.

¿Cómo hago para que solo recoja la categoría?

gracias!

Solucionado muchas gracias! Ahora tengo el problema de que quiero hacer toggle pero con un solo click y desconozco como hacerlo, alguien puede orientarme?

0

2 respuestas 2

0

En realidad el error es porque te faltan las comillas en el argumento de prueba:

var data = [{NombreCategoria: 'categoria1'}, {NombreCategoria: 'categoria2'}, {NombreCategoria: 'categoria3'}];

for (var i = 0; i < data.length; i++) {
  var categoria = data[i].NombreCategoria;
  if (categoria != null) {
      categoria = categoria.split(" ").join("");
  }
  else {
      categoria = "null";
      data[i].NombreCategoria = "Sin categoría";
  }
  $("#ContenedorConvenios").append(""
      + "<button class='btn btn-eco' onclick='prueba(\"" + categoria.toString() + "\");' id='" + categoria + "'>" + data[i].NombreCategoria + "</button>"
      + "");
  console.log("Hola" +categoria);
}

function prueba(cat) {
    console.log("adios" + cat);
    $('#'+cat).on('click', function () {
        $('.' +cat).toggle()
    });
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="ContenedorConvenios"></div>

1
  • muchas gracias! ya me funciona
    – kaiCo
    Commented el 30 ago. 2017 a las 10:28
-1

Es posible que sea por las comillas de "adios", prueba con comillas simples:

function prueba(cat) {
    console.log('adios' + cat);
    $('#'+cat).on('click', function () {
        $('.' +cat).toggle()
    });
}

La categoria que recoges tiene alguna comilla y está fallando la sintaxis?

3
  • Hola Flowen. Las frases como "es posible" sugieren que no estás seguro. Por favor, comprueba que tu solucion es valida antes de responder a la pregunta. Si no estas seguro, preguntale en los comentarios al autor que pruebe con ello. Mira Cómo responder para más informacion. Un saludo
    – lois6b
    Commented el 30 ago. 2017 a las 10:10
  • 1
    Eso no tiene nada que ver
    – lromeraj
    Commented el 30 ago. 2017 a las 10:11
  • exacto eso no tiene nada que ver. el caso que si la funcion prueba la pego en el html fuera de las funciones, me devuelve el codigo completo del boton
    – kaiCo
    Commented el 30 ago. 2017 a las 10:13

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