Ottieni l'ID di una casella di controllo? - jQuery

Question

Ehi, mi chiedo come ottenere l'id di una casella quando è selezionata.

Questo è ciò che il mio HTML sarebbe probabilmente simile a prima:

<div class="check_filter"> 

    <div id="filter"> 
     <input type="checkbox" id="check1" /><label for="check1">Marketing</label> 
     <input type="checkbox" id="check2" /><label for="check2">Automotive</label> 
     <input type="checkbox" id="check3" /><label for="check3">Sports</label> 
    </div> 

</div><!-- End check_filter --> 

Sto assumendo il jQuery sarebbe simile a questa:

$(document).ready(function() {  
    $(":checkbox").click(function(){ 
     var id = $(this).attr('id'); 

     $.post("index.php", { id: id }); 
     //return false to ensure the page doesn't refresh 
     return false; 
    });  
}); 

Sto cercando di ottenere il controllato ID oggetto e quindi postare quell'ID in una query mysql per prelevare i risultati dell'ID dal database.

Grazie per qualsiasi aiuto su questo.

Answer 1

Probabilmente si desidera l'evento change qui, in questo modo:

$(function() { 
    $(":checkbox").change(function(){ 
    $.post("index.php", { id: this.id, checked: this.checked }); 
    });  
}); 

Questo post ogni volta che una casella di controllo cambia e consente al lato PHP di conoscere l'ID e se è selezionato o meno.

Answer 2

Il jQuery che hai fornito funziona bene? Probabilmente dovresti rimuovere lo return false a mostrare che la casella è stata spuntata.

MODIFICA: $.post() è per una richiesta asincrona (tecnica AJAX) quindi non ci sarà alcun aggiornamento della pagina.

EDIT 2: Si consiglia inoltre di vedere se la casella di controllo è selezionata (non solo che ha cliccato):

$(document).ready(function() {  
    $(":checkbox").click(function(){ 
     var id = $(this).attr('id'); 
     var isChecked = $(this).attr('checked')); 
     $.post("index.php", { id: id, isChecked: isChecked }); 
    });  
}); 

Answer 3

È possibile utilizzare meglio jQuery get anziché post. Esso consente di gestire l'output della richiesta: http://api.jquery.com/jQuery.get/

Esempio:

$(document).ready(function() {  
    $(':checkbox').click(function(){ 
     var id = $(this).attr('id'); 
     var isChecked = $(this).attr('checked')); 
     $.get(
      'getcheckbox.php', 
      { id: id, isChecked: isChecked }, 
      function(data) { 
      //return value in getcheckbox.php and use it in on complete function 
      var result = data; 
      } 
     ); 
    });  
}); 

Answer 4

Perché ho solo bisogno di questo per il nome di una casella di controllo, ma $ (this) al fine di accedere al valore

$('input:checkbox').change(function() { 
     console.log("here i am: " + this.name + " value = " + $(this).val()); 
     } 
    ); 

Answer 5

È possibile utilizzare il selettore :checkbox e quindi controllare il id e controllato proprietà dell'elemento DOM in questo modo:

var id = $(this).find(":checkbox")[0].id; var isChecked = $(this).find(":checkbox")[0].checked;