Tuesday, October 8, 2013

jQuery - Using bPopup plugin to display data in Django

I tried to display the data content in a form of popups, and I found the bPopup plugin of jQuery which is very useful and easy to use. So, I just hide the content and then add bPopup display to the click event of a button:


        {% for msg in mail_logs %}
             <textarea readonly class="msgbody" id="msgbody-{{ msg.logid }}" value="" style="display:none;">{{ msg.body }}</textarea>
                <button class="showmsgbtn small button yellow" id="{{ msg.logid }}">Show Message</button>
        {% endfor %}
            btnid = jQuery(this).attr('id');
            textareaid = 'msgbody-' + btnid;
            jQuery('#' + textareaid).bPopup();

bPopup's homepage: http://dinbror.dk/bpopup/
bPopup's repo: https://github.com/dinbror/bpopup/