0

mi error es el siguiente: Tengo una ventana modal que funciona, dicha ventana tiene el siguiente codigo:

$(document).ready(function () {
    $('.accesori').click(function () {
        var id = this.getAttribute('id');
        //alert(id);

        $.get("module/accesori/controller/controller_accesori.php?op=read&id=" + id, function (data, status) {
            var json = JSON.parse(data);
            console.log(json);

            if(json === 'error') {
                //console.log(json);
                //pintar 503
                window.location.href='index.php?page=503';
            }else{
                console.log(json.accesori);
                $("#accesori").html(json.accesori);
                $("#imatge_accesori").html(json.imatge_accesori);
                $("#email").html(json.email);
                $("#codprod").html(json.codprod);
                $("#marca").html(json.marca);
                $("#modelo").html(json.modelo);
                $("#cantitat").html(json.cantitat);
                $("#data1").html(json.data1);
                $("#data2").html(json.data2);
                $("#pais").html(json.pais);
                $("#idioma").html(json.idioma);
                $("#observaciones").html(json.observaciones);
                $("#valoracio").html(json.valoracio);

                $("#details_accesori").show();
                $("#accesori_modal").dialog({
                    width: 850, //<!-- ------------- ancho de la ventana -->
                    height: 500, //<!--  ------------- altura de la ventana -->
                    //show: "scale", <!-- ----------- animación de la ventana al aparecer -->
                    //hide: "scale", <!-- ----------- animación al cerrar la ventana -->
                    resizable: "false", //<!-- ------ fija o redimensionable si ponemos este valor a "true" -->
                    //position: "down",<!--  ------ posicion de la ventana en la pantalla (left, top, right...) -->
                    modal: "true", //<!-- ------------ si esta en true bloquea el contenido de la web mientras la ventana esta activa (muy elegante) -->
                    buttons: {
                        Ok: function () {
                            $(this).dialog("close");
                        }
                    },
                    show: {
                        effect: "blind",
                        duration: 1000
                    },
                    hide: {
                        effect: "explode",
                        duration: 1000
                    }
                });
            }//end-else
        });
    });
});

El problema viene que ahora le he puesto un template, y me dice el error del titulo, y me gustaría saber alguna solucón, se que es algún tema de compatiblidad de librerias y/o versiones, pero no lo encuentro, alguna sugerencia? Gracias.

EDITO:

Las librerias que yo uso para que funcione la ventana modal y el datepicker son las siguientes:

        <link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
    <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="https://cdn.datatables.net/1.10.16/css/dataTables.bootstrap.min.css">
5
  • Estas importando el archivo js que contiene el metodo dialog().
    – Einer
    Commented el 12 ene. 2018 a las 12:19
  • ¿Tienes incluida la librería jQuery y cualquier otra librería/archivo que contenga la función que intentas usar (dando por supuesto que 1º se incluye la librería y luego se usa la función)? Ese tipo de errores suelen darse cuando la librería falta. Aunque esto es algo extraño: $('.accesori').click(function () {, el identificador precedido de . en jQuery es para las clases, no sé si se pueden escuchar los clicks que haces en una clase. ¿Es eso lo que quieres, escuchar los clicks hechos en una clase de css?
    – A. Cedano
    Commented el 12 ene. 2018 a las 12:20
  • Si tengo las librerias importadas, tanto las del modal como del datepicker las librerias que utilizo son las siguientes: ` <script src="code.jquery.com/jquery-1.12.4.js"></script> <script src="code.jquery.com/ui/1.12.1/jquery-ui.js"></script> <link rel="stylesheet" href="maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> <script src="maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/…> <link rel="stylesheet" href="cdn.datatables.net/1.10.16/css/dataTables.bootstrap.min.css"> `
    – Carlos
    Commented el 12 ene. 2018 a las 12:23
  • ¿Las tienes así, sin https://? Da error 404 si hago click en ellas. ¿Con $('.accesori').click(function () { tú quieres escuchar los clicks que se hacen sobre la clase accesori? Pon tus librerías completas: <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script> y de paso actualizas a la v. 3.
    – A. Cedano
    Commented el 12 ene. 2018 a las 12:27
  • Si que tienen https://, pero al copiarlas aqui, por el limite de caracteres no ha salido. Mi intención es que al hacer el click que se habra la ventana modal
    – Carlos
    Commented el 12 ene. 2018 a las 12:34

2 respuestas 2

0

Al ver tu código sentí curiosidad por saber si era posible escuchar los clicks ocurridos en una clase.

El fragmento de código que sigue demuestra que no es posible, al menos como lo estás intentando.

Esto $('.accesori').click(function () { no funcionará.

$(document).ready(function() {
  /*click sin on*/
  $('.class_accesori').click(function() {
    alert(1);
  });
  $('#id_accesori').click(function() {
    alert($(this).text());
  });

  /*click sin con on*/

  $(".class_accesori").on("click", function() {
    alert($(this).text());
  });

  $("#id_accesori").on("click", function() {
    alert($(this).text());
  });

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class "class_accesori">Escuchando la clase: Click aquí (no funcionará)</div>
<hr />
<div id="id_accesori">Escuchando el ID: Click aquí  (funcionará)</div>

1
  • He provado ese codigo, y si, funciona ahi solo, pero al adaptarlo al template no funciona. De la manera que lo tengo yo si que me funciona, pero sin el template, es decir, con una apariencia muy basica, pero ahora al ponerle el template no funciona, supongo que por temas de compatibilidades con librerias o versiones de estas.
    – Carlos
    Commented el 12 ene. 2018 a las 12:59
0

Finalmente he solucionado el error que tenia, y, efectivamente era por culpa de unas librerias que que tenia la plantilla, después de comentar dichas librerias, vuelve a funcionar tanto la ventana modal con el código que yo tenia anteriormente, y tampoco entra en conflicto con el datepicker. Muchas gracias de todas formas a A. Cedano por su interés. Las librerias a que tenia que comentar eran las siguientes:

<script src="assets/plugins/jquery-1.10.2.js"></script>
<script src="assets/plugins/bootstrap.js"></script>

Las cuales venian en la plantilla y hacen uso de plugins de jquery y bootstrap y entravan en conflico con las que yo tenia puestas al principio

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.