senden Knopfwert an Jquery AJAX mit onclick()

Question

ist es möglich, einen Wert von Knopf zu Jquery AJAX mit onclick Funktion zu senden? Ich habe etwas wie diesen Code versucht, aber nicht funktioniert. Im Konsolenprotokoll ist nichts enthalten.

html

<button type="button" class="hapus_krs" onclick="hapus_krs(this.value)" value="1">x</button> 
<button type="button" class="hapus_krs" onclick="hapus_krs(this.value)" value="2">x</button> 
<button type="button" class="hapus_krs" onclick="hapus_krs(this.value)" value="n">x</button> 

Skript

function hapus_krs() { 
    var formData = { 
     'id_mhs': $(this).val() 
    }; 
    $.ajax({ 
      type: 'POST', 
      url: '<?=base_url()?>akademik/hapus_krs', 
      data: formData, 
      dataType: 'json', 
      encode: true 
     }) 
     .done(function(data) { 
      console.log(data); 
     }) 
}; 

Answer 1

Wenn Sie die Funktion mit onclick="hapus_krs(this.value)" aufrufen, sind Sie bereits auf den Button Wert der Funktion als Parameter übergeben:

function hapus_krs(value) { 
    var formData = { 
     'id_mhs': value 
    }; 
} 

Unobtrusive JS Version :

<button type="button" class="hapus_krs" value="1">x</button> 
<button type="button" class="hapus_krs" value="2">x</button> 
<button type="button" class="hapus_krs" value="n">x</button> 

$('button.hapus_krs').click(function() { 
    var formData = { 
     'id_mhs': this.value // $(this).val() also works but it's unnecessary to invoke another jQuery call 
    }; 
}); 

Answer 2

Hier können Sie mit der Lösung gehen https://jsfiddle.net/60qu6mev/

$('.hapus_krs').click(function(){ 
 
var formData = { 
 
    'id_mhs': $(this).attr('value') 
 
}; 
 
console.log(formData); 
 
$.ajax({ 
 
     type: 'POST', 
 
     url: '<?=base_url()?>akademik/hapus_krs', 
 
     data: formData, 
 
     dataType: 'json', 
 
     encode: true 
 
    }) 
 
    .done(function(data) { 
 
     console.log(data); 
 
    }) 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button type="button" class="hapus_krs" value="1">x</button> 
 
<button type="button" class="hapus_krs" value="2">x</button> 
 
<button type="button" class="hapus_krs" value="n">x</button>

ich die Onclick entfernt von HTML, verwendet eher eine jQueryKlickEreignis zu handhaben Ajax Anruf & Retri eve Wert von Taste

Answer 3

Sie müssen vorsichtig sein, wenn Sie mit this spielen. In Ihrem Code verweist this möglicherweise nicht auf die Schaltfläche, auf die geklickt wurde.

Darüber hinaus übergeben Sie eine this.value als Parameter, und Sie verwenden es nicht. So sollte Ihre Funktion wie folgt aussehen:

function hapus_krs(value) { 
    var formData = { 
     'id_mhs': value 
    }; 
    $.ajax({ 
     type: 'POST', 
     url: '<?=base_url()?>akademik/hapus_krs', 
     data: formData, 
     dataType: 'json', 
     encode: true 
    }) 
    .done(function(data) { 
     console.log(data); 
    }) 
};