Hi,
I have found this strange behaviour of Web2py components when used with
Bootstrap3 Modal.
Adding data-toggle attribute to the A() helper breaks bootstrap.
Please consider the following example.
*Controller*:
def test_modal():
return dict()
*test_modal.load* view:
{{=BEAUTIFY(request.vars)}}
*test_modal.html* view:
{{extend 'layout.html'}}
{{=A('Open Modal + Load Data', callback=URL('test_modal.load', vars={"var1":
"varX","var2":"varY"}), target="tst_modal_data", _href="#tst_modal",
_class="btn
btn-danger", **{"_data-toggle":"modal"})}}
{{=A('Without data-toggle Attribute', callback=URL('test_modal.load', vars={
"var1":"varX","var2":"varY"}), target="tst_modal_data", _href="#tst_modal",
_class="btn btn-warning")}}
{{=A('Open Modal', _href="#tst_modal", _class="btn btn-info", **{
"_data-toggle":"modal"})}}
<div class="modal fade in" id="tst_modal" tabindex="-1" role="dialog" aria-
labelledby="ext_modalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"
aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="ext_modalTitleLabel">AJAX Modal<
/h4>
</div>
<div class="modal-body" id="tst_modal_data"
style="max-height:calc(100vh
- 200px); overflow-y:auto; overflow-x:auto;">
No Data Yet...
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default"
data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
So I have 3 buttons here.
1) By clicking the red one, which includes data-toggle="modal" attribute, I
expect a modal to pop up with data loaded from *test_modal.load* view, but
instead I'm redirected to this view.. :(
2) When I click the orange button, which doesn't have *data-toggle*
attribute, I see that indeed data was loaded. Now I can click blue button
to open the modal, and data is there.
So somehow *data-toggle* breaks everything...
Any hint how to solve this problem would be greatly appreciated.
Thanks
--
Resources:
- http://web2py.com
- http://web2py.com/book (Documentation)
- http://github.com/web2py/web2py (Source code)
- https://code.google.com/p/web2py/issues/list (Report Issues)
---
You received this message because you are subscribed to the Google Groups
"web2py-users" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to web2py+unsubscr...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
