Richiamare stessa funzione su più bottoni

[Darèios89]

Ciao a tutti, ho un problema, vorrei richiamare la stessa funzione, su più bottoni per rimuovere un evento, ovviamente essendo gli id univoci non posso da AJAX selezionare l'elemento con id, e ho visto che bisogna usare le classi. Ho una bozza di codice ma non va e non capisco cosa possa essere.

Questa è la jsp dove è contenuto il codice dei bottoni:

Immagine.jpg

Questo è il mio codice Javascript:
Vorrei recuperare un id di un bottone della classe "rimuovievento", prendere il relativo "value" e mandarlo ad una Servlet.

//rimuovere evento
        $(".rimuovievento").click(function() {


          id = $(this).data("id");
          idevento=document.getElementById(id).value;


        
    $.ajax({
        
         url : "EventiController",
         type: 'POST',
         dataType: "html",
         data: {action:"rimuovievento", idevento:idevento},
         
         
         success: function(data){
                  $("#eventorimosso").html(data);
                  alert("OK");
         },
         
            error: function (xhr, status, error) {
            alert(error);
        }
         
     });
    });

Sapreste dirmi cosa non va?

[Vindav]

prova cosi: idevento = $(this).val();

[Darèios89]

prova cosi: idevento = $(this).val();

Provato, ma clicco sul bottone e non succede nulla...

[cavicchiandrea]

L'evento click è racchiuso nel ready giusto?

[Darèios89]

L'evento click è racchiuso nel ready giusto?

Si esatto, per completezza riporto l'intero JavaScript, la funzione che mi interessa è l'ultima:
Ho fatto ulteriori modifiche alla funzione che sembrano non andare bene.

$(document).ready(function(){    
    //Aggiungere un campo
    $("#selectimpianto").click(function(){
        
        impianto=document.getElementById("selectimpianto").value;
        
    $.ajax({
         url : "EventiController",
         type: 'POST',
         dataType: "html",
         data: {action:"getimpianto",impianto:impianto},
         
         
         success: function(data){
                  $("#selectcampo").html(data);
         },
         
            error: function (xhr, status, error) {
            alert(error);
        }
         
     });
    });
    
    
    //quando aggiungo evento visualizzo lo sport dopo la selezione del campo
    //Aggiungere un evento
    $("#selectcampo").click(function(){
        
        campo=document.getElementById("selectcampo").value;
        impianto=document.getElementById("selectimpianto").value;
        
    $.ajax({
         url : "EventiController",
         type: 'POST',
         dataType: "html",
         data: {action:"getsport",campo:campo, impianto:impianto},
         
         
         success: function(data){
                  $("#selectsport").html(data);
         },
         
            error: function (xhr, status, error) {
            alert(error);
        }
         
     });
    });
            
            
            
                  //mostra listaeventi utente dopo click su bottone
    $("#eventibyuser").on('click', function(){
        
    $.ajax({
         url : "EventiController",
         type: 'POST',
         dataType: "html",
         data: {action:"geteventibyuser"},
         
         
         success: function(data){
                  $("#listaeventi").html(data);
         },
         
            error: function (xhr, status, error) {
            alert(error);
        }
    });
    
    });
    
    
    
        
   
        //agigungere un evento
        $("#aggiungievento").on('click', function(){
        
        campo=document.getElementById("selectcampo").value;
        impianto=document.getElementById("selectimpianto").value;


            data=document.getElementById("data").value;
            ora=document.getElementById("ora").value;
            sport=document.getElementById("selectsport").value;


        
    $.ajax({
        
         url : "EventiController",
         type: 'POST',
         dataType: "html",
         data: {action:"fine",campo:campo, impianto:impianto, data:data, ora:ora, sport:sport},
         
         
         success: function(data){
                  $("#eventoaggiunto").html(data);
         },
         
            error: function (xhr, status, error) {
            alert(error);
        }
         
     });
    });
    
    
    
    
    //rimuovere evento
        $(".rimuovievento").click(function() {


        idevento=$(this).attr("value");
       
        
        
    $.ajax({
        
         url : "EventiController",
         type: 'POST',
         dataType: "html",
         data: {action:"rimuovi", idevento:idevento},
         
         
         success: function(data){
                  $("#eventorimosso").html(data);
                  alert("OK");
         },
         
            error: function (xhr, status, error) {
            alert(error);
        }
         
     });
    });
    
    
    
    
    


    
    
    
        
    
});

[Vindav]

non sto li a vedere tutto il codice, guarda la console del browser e riportaci gli errori se ci sono, facciamo prima. Verifica anche se la chiamata ajax va a buon fine, lo puoi vedere sempre nella console.

p.s. visto che usi jquery l'istruzione document.getElementById("ID").value; corrisponde a $("#ID").val();

[Darèios89]

non sto li a vedere tutto il codice, guarda la console del browser e riportaci gli errori se ci sono, facciamo prima. Verifica anche se la chiamata ajax va a buon fine, lo puoi vedere sempre nella console.

p.s. visto che usi jquery l'istruzione document.getElementById("ID").value; corrisponde a $("#ID").val();

Anche questo è un problema, nel senso che non capisco che problema possa esserci perchè non sono riportati errori. Uso Netbeans, la console di Glassfish è pulita, e anche il browser log. Ho messo degli alert ma non compare nulla. Da cui sembrerebbe che non vada bene la chiamata AJAX.

[Vindav]

Mi dici quale browser usi per le prove? cosi posso darti indicazioni piu mirate su cosa cercare nella console.

Visto che hai parlato di alert, se metti un alert subito dopo aver definito il listener sulla classe rimuovievento non compare?

$(".rimuovievento").click(function(){

alert("ciao"); <--- compare? se si allora il problema è la chiamata ajax
        idevento=$(this).attr("value");
....

[Darèios89]

Mi dici quale browser usi per le prove? cosi posso darti indicazioni piu mirate su cosa cercare nella console.

Visto che hai parlato di alert, se metti un alert subito dopo aver definito il listener sulla classe rimuovievento non compare?

$(".rimuovievento").click(function(){

alert("ciao"); <--- compare? se si allora il problema è la chiamata ajax
        idevento=$(this).attr("value");
....

Certo, uso google Chrome con l'estensione di Netbeans, no mettendo un alert in quel punto non compare nulla...

[Vindav]

allora il problema non è la chiamata ajax... la pagina è online? hai un link da passarci?


Su chrome premi F12, posizionati su tab console e vedi se vengono segnalati errori(sono evidenziati in rosso).