Dear Cristina,
I make the modal in the main page and use components (LOAD()) to submit the
forms. This way, each form shall have its own controller function (for
instance, your_form) and view ('your_form.load'). The javascripts are
inserted by the form functions (the component). I use response.js. As an
example of main page:
def show_entities():
response.title = 'Home'
projects_list = []
nav_bar = []
project_name = ''
form_ret = None
form_det = None
form_ent = None
table_ent = None
if request.args:
project_id = request.args(0, cast=int)
project_name = db.project(project_id).project_name
nav_bar = gera_nav_bar(project_id)
response.js = '$("#entity_modal").modal("show");'
form_ret = LOAD('default', 'cru_ret.load',
args=request.args(0), ajax=True, target='form_ret')
form_det = LOAD('default', 'cru_det.load',
args=request.args(0), ajax=True, target='form_det')
form_ent = LOAD('default', 'cru_ent.load',
args=request.args(0), ajax=True, target='form_ent')
table_ent = LOAD('default', 'table_entities.load',
args=request.args(0), ajax=True, target='table_ent'
)
else:
projects_query_results = db(db.project.id > 0).select(orderby=
db.project.id)
projects_list = cria_tabela_projetos(projects_query_results,
'show_entities')
return dict(projects_list=projects_list,
project_name=project_name,
nav_bar=nav_bar,
form_ret=modal_helper('ret_modal', 'Record Entity Type'
, form_ret),
form_det=modal_helper('det_modal', 'Data Entity Type'
, form_det),
form_ent=modal_helper('entity_modal', 'Entity', form_ent),
table_ent=table_ent)
Here an example of component controller function:
def cru_ent():
table_style = 'bootstrap4_stacked'
if len(request.args) > 1: # update entity button
entity_id = request.args(1, cast=int)
form = SQLFORM(db.entity, db.entity(entity_id), formstyle=
table_style)
response.js = '$("#entity_modal").modal("show");'
elif request.args: # only project information
project_id = request.args(0, cast=int)
db.entity.project_id.default = project_id
form = SQLFORM(db.entity, formstyle=table_style)
if request.vars.reload_div:
response.js = '$("#entity_modal").modal("show");'
else: # general call even without project
form = SQLFORM(db.entity, formstyle=table_style)
if form.process().accepted:
response.flash = 'New Entity added!'
if request.vars.reload_div:
response.js = "jQuery('#%s').get(0).reload();" %
request.vars.reload_div
response.js += "jQuery('#table_ent').get(0).reload();"
response.js += '$("#entity_modal").modal("hide");'
return dict(form=form)
Just for completion, below is the code of the function to create a modal
(used at main controller function). I prefer using HTML helpers in
controller functions because PYTHON feels more simple to work.
def modal_helper(modal_id, title, body_content,
footer_content=BUTTON('Close',
**{'_type':"button",
'_class':"btn btn-danger",
'_data-dismiss':"modal"})):
""" Creates a modal.
!!!! attention: it needs to stay on first level, out of any other div or
container, otherwise it may not appear.
Requires importing: BUTTON, H4, DIV from gluon.html.
Arguments:
modal_id (string): id of modal in page.
title (string or web2py HMTL helper): title of the modal, display in
big
letters on top.
body_content (web2py HMTL helper): object to display in modal.
For example, a form for a table.
footer_content (web2py HMTL helper): object to display in modal footer.
Return:
a DIV object of modal class.
"""
close_btn = BUTTON(
I(**{'_class': 'fa fa-times fa-2x'}),
**{'_type':"button",
'_class':"close",
'_data-dismiss':"modal"})
header_title = H4(title, _class="modal-title")
header = DIV(header_title, close_btn, _class="modal-header")
body = DIV(body_content, _class="modal-body")
footer = DIV(footer_content, _class="modal-footer")
return DIV(
DIV(
DIV(header, body, footer, _class="modal-content"),
_class="modal-dialog"),
_class="modal", _id=modal_id)
On the button to open the modal I include in request.vars the id of the
component with the table of entities to make it reload after submitting the
form.
The component view is simple: just make {{=form}}. Follows the main view
(show_entities.html):
{{=nav_bar}}
{{=form_det}}
{{=form_ent}}
{{=form_ret}}
<div class="widget-container-col">
<div class="widget-box widget-color-grey">
{{if [] == projects_list:}}
<div class="row-12">
<h2 class='display-5'>{{=project_name}}</h2>
</div>
<div class="row-12">
{{=table_ent}}
</div>
{{else:}}
{{=projects_list}}
{{pass}}
</div>
</div>
Important: modal must stay at first level to appear, otherwise it will
inherit the z-index of its parent.
Em sexta-feira, 18 de outubro de 2019 19:01:30 UTC-3, Cristina Sig escreveu:
>
> Thanks for your explanation,
>
> I'm a newbie on web2py so I have some doubts.
> Do you set your modal and script that calls that modal on the main page?
> or do you call it from a different view page?
> I'm a little bit confused
>
>
--
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.
To view this discussion on the web visit
https://groups.google.com/d/msgid/web2py/4c42ea2a-591a-4b78-b61e-1ad32d36303d%40googlegroups.com.
