I am trying to set up some popovers with checkboxes to submit their status by linking them to a div. But I have some problems to update the content of the popover when I close it and open it again.
HTML:
<form type="submit" action="index.php?action=updateSysteme" method="post">
<div id="test" style="display:block">
<input type="checkbox" name="1" checked> 1 </input>
<input type="checkbox" name="2"> 2 </input>
<input type="checkbox" name="3"> 3 </input>
<input type="checkbox" name="4"> 4 </input>
</div>
<button data-toggle="popover" id="btn" data-original-title="Systemowner" data-html="true" data-placement="bottom" type="button" class="btn btn-default" onclick="click()" aria-label="Left Align">
<span class="glyphicon glyphicon-chevron-down" aria-hidden="true"> </span>
</button>
</form>
Javascript:
$(function () {
$('[data-toggle="popover"]').popover();
})
$('#btn').popover({
html : true,
content: function() {
return $('#test').html();
}
});
function click(){
var myPopover = $('#btn').data('bs.popover');
myPopover.options.content = function(){
return $('#test').html();
};
}
With function click() I try to update the status of the checkboxes within the popover, but there is absolutely no result when I change the status of a checkbox in the div. The popover shows just the status of the first initializing (so first checkbox checked only). I assume that the problem comes from return $('#test').html(); in function click() because I think that the HTML of #test doesn't change if I tick or untick a checkbox. Is there any workaround?
Thank you very much!
Aucun commentaire:
Enregistrer un commentaire