[SOLUCIONADO] Evento onclick en CHECKBOX que solo entra al segundo

[milotower]

Buenos días.

me ocurre una cosa con este trocito de código, creo que debe ser un error de concepto propio mio.

El caso es que solo ejecuta la petición asíncrona AJAX cuando pulso por segunda vez el checkbox.

¿Por qué puede estar ocurriendo esto?

Un saludo y muchas gracias.

Código HTML:

<input type="checkbox" id="confirmar"  name="confirmar" data-id="reserva" class="form-control" onclick="guardar_confirmar()"/> 

Código Javascript:

<script type="application/javascript">
                       function guardar_confirmar() {
 
                           alert("dentro");
                           var checkbox = document.getElementById("confirmar"),
 
                               ajax = function(url){
                                   var xhr = window.XMLHttpRequest ?
                                       new XMLHttpRequest() :
                                       new ActiveXObject("Microsoft.XMLHTTP") ||
                                       new ActiveXObject("Msxml2.XMLHTTP");
 
                                   xhr.open("GET", url, true);
                                   xhr.send(null);
                               };
 
                           checkbox.addEventListener("click", function(){
                               var estado = this.checked ? 1 : 0, //Si está marcado, asigno 1 a 'estado', si no, 0
                                   id = this.getAttribute("data-id"), //El valor del pseudo-atributo 'data-id'
                                   url = "/admin/editar-detalle-cobro.php?estado=" + estado + "&idcheckbox=" + id + "&confirmar=1" + "$id=";
                               alert(url);
                               ajax(url); //Ejecuto la petición asíncrona, enviando los valores
                           }, false);
                       }
                    </script>
 

[ArturoGallegos]

ciertamente tienes error de concepto, no te funciona porque metes dentro de addEventListener la llamada ajax

ese esta fuera de lugar, prueba retirandolo y la funcion ajax sacandola... algo asi

Código Javascript:

function ajax(url){
    var xhr = window.XMLHttpRequest ?
  new XMLHttpRequest() :
  new ActiveXObject("Microsoft.XMLHTTP") ||
  new ActiveXObject("Msxml2.XMLHTTP");
 
  xhr.open("GET", url, true);
  xhr.send(null);
};
 
function guardar_confirmar() {
    alert("dentro");
  var checkbox = document.getElementById("confirmar"),
    var estado = this.checked ? 1 : 0, //Si está marcado, asigno 1 a 'estado', si no, 0
  id = this.getAttribute("data-id"), //El valor del pseudo-atributo 'data-id'
  url = "/admin/editar-detalle-cobro.php?estado=" + estado + "&idcheckbox=" + id + "&confirmar=1" + "$id=";
  alert(url);
  ajax(url); //Ejecuto la petición asíncrona, enviando los valores
}
 

[xfxstudios]

com ya te dijeron, o llamas a la funcion desde el check o utilizas el observador, pero alli estas redundando, porque al hacer click en el check activas el observador que esta a la espera del click para ejecutar el ajax.

[milotower]

Muchas gracias,

estábais en lo cierto. Lo he solucionado así:

Código Javascript:

function guardar_confirmar(idcheckbox) {
 
                            var checkbox = document.getElementById(idcheckbox),
 
                                ajax = function(url){
                                    var xhr = window.XMLHttpRequest ?
                                        new XMLHttpRequest() :
                                        new ActiveXObject("Microsoft.XMLHTTP") ||
                                        new ActiveXObject("Msxml2.XMLHTTP");
 
                                    xhr.open("GET", url, true);
                                    xhr.send(null);
                                };
                            var estado = checkbox.checked ? 1 : 0;
                            var id = checkbox.getAttribute("id-vehiculo");
                            var url = "/admin/editar-detalle-cobro.php?estado=" + estado + "&idcheckbox=" + idcheckbox + "&confirmar=1" + "&id=" + id;
                            ajax(url);
                        }
 

¿Qué os parece?

[ArturoGallegos]

Siendo sincero no veo porque crear una función ajax si solo se utiliza en ese momento, por eso la habia sacado pero ya es tu gusto, cada quien tiene su forma de trabajo.

[milotower]

El caso es que si saco la función Ajax no realiza la petición... así que no sé...