2016-06-14 16 views
1

Ich muss einen Datenwert lesen, der in einem Bootstrap-Popover enthalten ist. EinzelheitenDatenattribut aus Popover lesen

:

Es gibt eine popover an einer Platte verbunden sind. In das Popover gibt es einen Link, der (per onClick) eine Funktion auslöst, die den Wert des Attributs data-info im panel div lesen muss.

HTML-Code:

<div class="panel panel-success redim" data-info="informations" data-content="&lt;div onClick=&quot;modifica_appuntamento()&quot; class=&quot;text-center&quot;&gt;&lt;a href=&quot;#&quot;&gt;Get info&lt;/a&gt;&lt;/div&gt;" data-original-title="Get data from popover"> 
     <div class="panel-heading">Heading</div> 
     <div class="panel-body">Body</div> 
</div> 

JQuery:

$(function() { 
popoverOptions = { 
html: true, 
animation: true 
}; 
$('.panel').popover(popoverOptions); 
}); 

function modifica_appuntamento() { 
    alert($(this).parent().data('info')); 
} 

JSFiddle: https://jsfiddle.net/fabioravizzotti/3h4vu8Ly/

Können Sie mir helfen, eine Lösung zu finden?

Danke.

Antwort

1

Erstes Problem:

Ihre Elementselektoreinrichtung falsch ist, wie .parent() in diesem Fall tatsächlich die Haupt .popover div ist und die Element Sie versuchen, von bekommen data-info ist .prev(). So sollten Sie verwenden:

$(this).closest('.popover').prev().data('info'); 

Zweites Problem:

Sie nicht $(this) in Ihrer Funktion nutzen zu können. Mit Inline-onclick Attribute sollten Sie das Element an die Funktion übergeben:

onClick='modifica_appuntamento(this);' 

dann:

function modifica_appuntamento(elem) { 
    $(elem).... 
} 

Auf einer Seite zur Kenntnis.
It's not a good practice to use javascript attributes
Ich würde Ihnen vorschlagen, eine class="data-info" den popover Links hinzufügen und delegieren Ereignis mit jQuery klicken:

$(document).on('click', '.data-info', function(){ 
    alert($(this).closest('.popover').prev().data('info')); 
}); 

JSFiddle Demo

+0

Hallo Artur, es funktioniert, tut mir leid, aber ich bin ein Neuling auf Javascript. Ich verstehe nicht, wie Sie _.popover_ selector in der nächsten Funktion verwenden können. Eine Klasse namens "Popover" gibt es nicht in HTML. Sie erhalten es von der Bootstrap-Vorlage? Vielen Dank. – Fabio

+0

'.popover' wird dynamisch durch Bootstrap erstellt, wenn ein * Popover * erscheint (es ist das Haupt-Popover DIV) –