jQuery kann nicht Daten erhalten - * Attributwert, Rückgabe undefined

Question

Sup, ich habe ein Problem mit Daten - * Wert mit jQuery.

Mein HTML-Code ist:

<button type="button" 
    class="btn btn-danger" 
    id="{{ currency.id }}" 
    data-curname="{{ currency.name }}" 
    data-toggle="modal" 
    data-target="#deleteConfirm" 
    onclick="deleteCurConf(this.id)"> 
    <span class="glyphicon glyphicon-remove"></span> 
    &nbsp;Delete 
</button> 

jQuery ist:

function deleteCurConf(id) { 
var curName = $('#' + id).data('curname'); 
console.log(curName); 
} 

Aber Konsole Log-Returns nicht definiert. Und das Interessanteste, dass dieser Code gestern funktioniert hat, aber heute ist er kaputt. Irgendeine Idee?

Btw, ich bin mit Bootstrap3 und Zweig

Answer 1

Zwei kleine Änderungen erforderlich:

1) nur this statt this.id passieren, während Funktion aufrufen:

<button type="button" 
    class="btn btn-danger" 
    id="{{ currency.id }}" 
    data-curname="{{ currency.name }}" 
    data-toggle="modal" 
    data-target="#deleteConfirm" 
    onclick="deleteCurConf(this)"> 
    <span class="glyphicon glyphicon-remove"></span> 
    &nbsp;Delete 
</button> 

2) in Funktion:

Answer 2

Cleaner Weg zu tun jQuery wäre:

<button type="button" 
    class="btn btn-danger handleClick" // Added extra class 
    id="{{ currency.id }}" 
    data-curname="{{ currency.name }}" 
    data-toggle="modal" 
    data-target="#deleteConfirm"  
    <span class="glyphicon glyphicon-remove"></span> 
    &nbsp;Delete 
</button> 

jQuery

$("document").on("click",".handleClick",function(evnt){ 

var curName = $(evnt.target).data('curname'); // use $(id) 
console.log(curName); 

})