Selector this and data attributes not showing in Bootstrap modal?

Question

JavaScript

There are two links, they are distinguished only by data-attributes inside.
Using the this selector and attribute date, we display a specific value using JAVA, code example:
jsfiddle.net/VhsUQ/3
The problem is that this construction does not work when the necessary data from data attributes must be displayed in a modal window when clicking on a link bootstrap.
How to solve this issue? Please, help.

Answer 1

I solved this issue by modifying the code itself a little:

<script type="text/javascript">//<![CDATA[
$(window).load(function(){
    $(function(){
        $('.btn-xs').click(function(e){
            e.preventDefault;
            $('#blc').html('<div class="img"><img style="width: 100%;" src="'+$(this).data('bimg')+'" alt="оформление заказа"></div><h3 class="hd"> '+$(this).data('bname')+' </h3><p style="color: rgb(231, 76, 60);">'+$(this).data('bprice')+' грн.</p>');
        });
    })
});//]]> 

</script>

everything works like this. Working example fixed, use it! Thanks to all!

Answer 2

What's the problem? got the data written into a variable, and then substitute it in the window, it will always be visible, I didn’t quite understand the essence of your problem, in your example there is no window, if you don’t understand my words, throw off a full-fledged example with a modal window and feel your problem)