示例#1
0
def build_table_form(class_: str, linked_entities: List[Entity]) -> str:
    """ Returns a form with a list of entities with checkboxes."""
    if class_ == 'file':
        entities = Entity.get_by_class('file', nodes=True)
    elif class_ == 'place':
        entities = Entity.get_by_class('place', nodes=True, aliases=True)
    else:
        entities = Entity.get_by_view(class_)

    linked_ids = [entity.id for entity in linked_entities]
    table = Table([''] + g.table_headers[class_], order=[[1, 'asc']])
    file_stats = get_file_stats() if class_ == 'file' else None
    for entity in entities:
        if entity.id in linked_ids:
            continue  # Don't show already linked entries
        input_ = '<input id="selection-{id}" name="values" type="checkbox" value="{id}">'.format(
            id=entity.id)
        table.rows.append([input_] + get_base_table_data(entity, file_stats))
    if not table.rows:
        return uc_first(_('no entries'))
    return """
        <form class="table" id="checkbox-form" method="post">
            <input id="csrf_token" name="csrf_token" type="hidden" value="{token}">
            <input id="checkbox_values" name="checkbox_values" type="hidden">
            {table}
            <input id="save" class="{class_}" name="save" type="submit" value="{link}">
        </form>""".format(link=uc_first(_('link')),
                          token=generate_csrf(),
                          class_=app.config['CSS']['button']['primary'],
                          table=table.display(class_))
示例#2
0
def table_select_model(self, name: str, selected=None) -> str:
    # Todo: extra sortfunction for class and property code e.g. E69
    if name in ['domain', 'range']:
        entities = g.classes
    else:
        entities = g.properties
    table = Table(['code', 'name'],
                  defs='''[{"orderDataType": "cidoc-model", "targets":[0]},
                                            {"sType": "numeric", "targets": [0]}]'''
                  )
    for id_ in entities:
        table.rows.append([
            '<a onclick="selectFromTable(this, \'' + name + '\', \'' +
            str(id_) + '\')">' + entities[id_].code + '</a>',
            '<a onclick="selectFromTable(this, \'' + name + '\', \'' +
            str(id_) + '\')">' + entities[id_].name + '</a>'
        ])
    value = selected.code + ' ' + selected.name if selected else ''
    html = """
        <input id="{name}-button" value="{value}" class="table-select" type="text"
            onfocus="this.blur()" readonly="readonly" />
        <div id="{name}-overlay" class="overlay">
            <div id="{name}-dialog" class="overlay-container">
                {table}
            </div>
        </div>
        <script>$(document).ready(function () {{createOverlay("{name}");}});</script>
    """.format(name=name, value=value, table=table.display(name))
    return html
示例#3
0
def build_table_form(class_name: str, linked_entities: Iterator) -> str:
    """ Returns a form with a list of entities with checkboxes"""
    from openatlas.models.entity import EntityMapper
    table = Table(Table.HEADERS[class_name] + [''])
    linked_ids = [entity.id for entity in linked_entities]
    file_stats = get_file_stats() if class_name == 'file' else None
    if class_name == 'file':
        entities = EntityMapper.get_by_system_type('file', nodes=True)
    elif class_name == 'place':
        entities = EntityMapper.get_by_system_type('place',
                                                   nodes=True,
                                                   aliases=True)
    else:
        entities = EntityMapper.get_by_codes(class_name)
    for entity in entities:
        if entity.id in linked_ids:
            continue  # Don't show already linked entries
        input_ = '<input id="selection-{id}" name="values" type="checkbox" value="{id}">'.format(
            id=entity.id)
        table.rows.append(get_base_table_data(entity, file_stats) + [input_])
    if not table.rows:
        return uc_first(_('no entries'))
    return """
        <form class="table" id="checkbox-form" method="post">
            <input id="csrf_token" name="csrf_token" type="hidden" value="{token}">
            <input id="checkbox_values" name="checkbox_values" type="hidden">
            {table} <button name="form-submit" id="form-submit" type="submit">{add}</button>
        </form>""".format(add=uc_first(_('add')),
                          token=generate_csrf(),
                          table=table.display(class_name))
示例#4
0
def table_select_model(self: Any,
                       name: str,
                       selected: Union[CidocClass, CidocProperty, None] = None) -> str:
    if name in ['domain', 'range']:
        entities = g.cidoc_classes
    else:
        entities = g.properties
    table = Table(['code', 'name'], defs=[
        {'orderDataType': 'cidoc-model', 'targets': [0]},
        {'sType': 'numeric', 'targets': [0]}])

    for id_ in entities:
        table.rows.append([
            """<a
                    onclick="selectFromTable(this, '{name}', '{entity_id}', '{value}')"
                    href="#">{label}</a>""".format(
                name=name,
                entity_id=id_,
                value=entities[id_].code + ' ' + entities[id_].name,
                label=entities[id_].code),
            """<a
                    onclick="selectFromTable(this, '{name}', '{entity_id}', '{value}')"
                    href="#">{label}</a>""".format(
                name=name,
                entity_id=id_,
                value=entities[id_].code + ' ' + entities[id_].name,
                label=entities[id_].name)])
    value = selected.code + ' ' + selected.name if selected else ''
    html = """
        <input id="{name}-button" name="{name}-button" class="table-select" type="text"
            onfocus="this.blur()" readonly="readonly" value="{value}"
            onclick="$('#{name}-modal').modal('show')">
            <div id="{name}-modal" class="modal fade" tabindex="-1" role="dialog"
                aria-hidden="true">
                <div class="modal-dialog" role="document" style="max-width: 100%!important;">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title">{name}</h5>
                            <button type="button" class="btn btn-outline-primary btn-sm"
                                data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true">&times;</span>
                            </button>
                        </div>
                        <div class="modal-body">{table}</div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-outline-primary btn-sm"
                                data-dismiss="modal">{close_label}</button>
                        </div>
                    </div>
                </div>
            </div>""".format(
        name=name,
        value=value,
        close_label=display.uc_first(_('close')),
        table=table.display(name))
    return html
示例#5
0
文件: field.py 项目: craws/OpenAtlas
 def __call__(self, field: TableField, **kwargs: Any) -> TableSelect:
     selection = ''
     if field.id in ('cidoc_domain', 'cidoc_property', 'cidoc_range'):
         table = Table(['code', 'name'],
                       order=[[0, 'desc']],
                       defs=[{
                           'orderDataType': 'cidoc-model',
                           'targets': [0]
                       }, {
                           'sType': 'numeric',
                           'targets': [0]
                       }])
         for id_, entity in (g.properties if field.id == 'cidoc_property'
                             else g.cidoc_classes).items():
             table.rows.append([
                 f"""
                 <a href="#" onclick="selectFromTable(
                     this,
                     '{field.id}',
                     '{id_}',
                     '{entity.code} {entity.name}');">{entity.code}</a>""",
                 entity.name
             ])
     else:
         aliases = current_user.settings['table_show_aliases']
         if 'place' in field.id \
                 or field.id in ['begins_in', 'ends_in', 'residence']:
             class_ = 'place'
             entities = Entity.get_by_class('place',
                                            types=True,
                                            aliases=aliases)
         elif field.id.startswith('event_'):
             class_ = 'event'
             entities = Entity.get_by_view('event',
                                           types=True,
                                           aliases=aliases)
         else:
             class_ = field.id
             entities = Entity.get_by_view(class_,
                                           types=True,
                                           aliases=aliases)
         table = Table(g.table_headers[class_])
         for entity in entities:
             if field.data and entity.id == int(field.data):
                 selection = entity.name
             data = get_base_table_data(entity, show_links=False)
             data[0] = self.format_name_and_aliases(entity, field.id)
             table.rows.append(data)
     return super().__call__(field, **kwargs) + render_template(
         'forms/table_select.html',
         field=field,
         table=table.display(field.id),
         selection=selection)
示例#6
0
    def __call__(self, field, **kwargs):
        if field.data and type(field.data) is str:
            field.data = ast.literal_eval(field.data)
        selection = ''
        class_ = field.id if field.id != 'given_place' else 'place'
        headers_len = str(len(Table.HEADERS[class_]))

        # Make checkbox column sortable and show selected on top
        table = Table(Table.HEADERS[class_],
                      order='[[' + headers_len + ', "desc"], [0, "asc"]]')

        # Table definitions (ordering and aligning)
        defs = '{"orderDataType": "dom-checkbox", "targets":' + headers_len + '}'
        if class_ == 'event':
            defs += ',{className: "dt-body-right", targets: [3,4]}'
        elif class_ in ['actor', 'group', 'feature', 'place']:
            defs += ',{className: "dt-body-right", targets: [2,3]}'
        table.defs = '[' + defs + ']'

        if class_ == 'place':
            aliases = current_user.settings['table_show_aliases']
            entities = EntityMapper.get_by_system_type('place',
                                                       nodes=True,
                                                       aliases=aliases)
        else:
            entities = EntityMapper.get_by_codes(class_)
        for entity in entities:
            selection += entity.name + '<br/>' if field.data and entity.id in field.data else ''
            data = get_base_table_data(entity)
            data[0] = re.sub(re.compile('<a.*?>'), '', data[0])  # Remove links
            data.append(
                """<input type="checkbox" id="{id}" {checked} value="{name}"
                class="multi-table-select">""".format(
                    id=str(entity.id),
                    name=entity.name,
                    checked='checked = "checked"'
                    if field.data and entity.id in field.data else ''))
            table.rows.append(data)
        html = """
            <span id="{name}-button" class="button">{change_label}</span><br />
            <div id="{name}-selection" class="selection" style="text-align:left;">{selection}</div>
            <div id="{name}-overlay" class="overlay">
            <div id="{name}-dialog" class="overlay-container">{table}</div></div>
            <script>
                $(document).ready(function () {{createOverlay("{name}", "{title}", true);}});
            </script>""".format(name=field.id,
                                change_label=uc_first(_('change')),
                                title=_(field.id.replace('_', ' ')),
                                selection=selection,
                                table=table.display(field.id))
        return super(TableMultiSelect, self).__call__(field, **kwargs) + html
示例#7
0
def display_move_form(self, form, root_name: str) -> str:
    html = ''
    for field in form:
        if type(field) is TreeField:
            html += '<p>' + root_name + ' ' + str(field) + '</p>'
    html += """
        <p>
            <a class="button" id="select-all">{select_all}</a>
            <a class="button" id="select-none">{deselect_all}</a>
        </p>""".format(select_all=util.uc_first(_('select all')),
                       deselect_all=util.uc_first(_('deselect all')))
    table = Table(['#', util.uc_first(_('selection'))])
    for item in form.selection:
        table.rows.append([item, item.label.text])
    return html + table.display('move')
示例#8
0
 def __call__(self, field, **kwargs):
     file_stats = None
     class_ = 'place' if field.id in ['residence', 'begins_in', 'ends_in'] else field.id
     if class_ == 'place':
         aliases = current_user.settings['table_show_aliases']
         entities = EntityMapper.get_by_system_type('place', nodes=True, aliases=aliases)
     elif class_ == 'reference':
         entities = EntityMapper.get_by_system_type('bibliography') + \
                    EntityMapper.get_by_system_type('edition') + \
                    EntityMapper.get_by_system_type('external reference')
     elif class_ == 'file':
         entities = EntityMapper.get_display_files()
         file_stats = get_file_stats()
     else:
         entities = EntityMapper.get_by_codes(class_)
     selection = ''
     table = Table(Table.HEADERS[class_])
     for entity in entities:
         # Todo: don't show self e.g. at source
         if field.data and entity.id == int(field.data):
             selection = entity.name
         data = get_base_table_data(entity, file_stats)
         data[0] = """<a onclick="selectFromTable(this,'{name}', {entity_id})">{entity_name}</a>
                     """.format(name=field.id,
                                entity_id=entity.id,
                                entity_name=truncate_string(entity.name, span=False))
         data[0] = '<br />'.join([data[0]] + [
             truncate_string(alias) for id_, alias in entity.aliases.items()])
         table.rows.append(data)
     html = """
         <input id="{name}-button" name="{name}-button" class="table-select {required}"
             type="text" placeholder="{change_label}" onfocus="this.blur()" readonly="readonly"
             value="{selection}">
         <a id="{name}-clear" class="button" {clear_style}
             onclick="clearSelect('{name}');">{clear_label}</a>
         <div id="{name}-overlay" class="overlay">
         <div id="{name}-dialog" class="overlay-container">{table}</div></div>
         <script>$(document).ready(function () {{createOverlay("{name}", "{title}");}});</script>
         """.format(name=field.id,
                    title=_(field.id.replace('_', ' ')),
                    change_label=uc_first(_('change')),
                    clear_label=uc_first(_('clear')),
                    table=table.display(field.id),
                    selection=selection,
                    clear_style='' if selection else ' style="display: none;" ',
                    required=' required' if field.flags.required else '')
     return super(TableSelect, self).__call__(field, **kwargs) + html
示例#9
0
def display_move_form(self: Any, form: Any, root_name: str) -> str:
    from openatlas.forms.field import TreeField
    html = ''
    for field in form:
        if isinstance(field, TreeField):
            html += '<p>' + root_name + ' ' + str(field) + '</p>'
    table = Table(
        header=['#', display.uc_first(_('selection'))],
        rows=[[item, item.label.text] for item in form.selection])
    return html + """
        <div class="toolbar">
            {select_all}
            {deselect_all}
        </div>
        {table}""".format(
        select_all=display.button(_('select all'), id_="select-all"),
        deselect_all=display.button(_('deselect all'), id_="select-none"),
        table=table.display('move'))
示例#10
0
文件: form.py 项目: craws/OpenAtlas
def build_table_form(class_: str, linked_entities: list[Entity]) -> str:
    """Returns a form with a list of entities with checkboxes."""
    if class_ == 'place':
        entities = Entity.get_by_class('place', types=True, aliases=True)
    else:
        entities = Entity.get_by_view(class_, types=True, aliases=True)
    linked_ids = [entity.id for entity in linked_entities]
    table = Table([''] + g.table_headers[class_], order=[[1, 'asc']])
    for entity in entities:
        if entity.id in linked_ids:
            continue  # Don't show already linked entries
        input_ = f"""
            <input
                id="selection-{entity.id}"
                name="values"
                type="checkbox" value="{entity.id}">"""
        table.rows.append([input_] +
                          get_base_table_data(entity, show_links=False))
    if not table.rows:
        return uc_first(_('no entries'))
    return render_template('forms/form_table.html',
                           table=table.display(class_))
示例#11
0
 def __call__(self, field, **kwargs):
     if field.data and type(field.data) is str:
         field.data = ast.literal_eval(field.data)
     selection = ''
     class_ = field.id if field.id != 'given_place' else 'place'
     table = Table(Table.HEADERS[class_])
     # Make checkbox column sortable and show selected on top
     table.headers = 'headers:{' + str(len(table.header)) + ':{sorter:"checkbox"}},'
     table.sort = 'sortList:[[' + str(len(table.header)) + ', 0],[0, 0]],'
     if class_ == 'place':
         aliases = current_user.settings['table_show_aliases']
         entities = EntityMapper.get_by_system_type('place', nodes=True, aliases=aliases)
     else:
         entities = EntityMapper.get_by_codes(class_)
     for entity in entities:
         selection += entity.name + '<br/>' if field.data and entity.id in field.data else ''
         data = get_base_table_data(entity)
         data[0] = re.sub(re.compile('<a.*?>'), '', data[0])  # Remove links
         data.append("""<input type="checkbox" id="{id}" {checked} value="{name}"
             class="multi-table-select">""".format(
             id=str(entity.id),
             name=entity.name,
             checked='checked = "checked"' if field.data and entity.id in field.data else ''))
         table.rows.append(data)
     html = """
         <span id="{name}-button" class="button">{change_label}</span><br />
         <div id="{name}-selection" class="selection" style="text-align:left;">{selection}</div>
         <div id="{name}-overlay" class="overlay">
         <div id="{name}-dialog" class="overlay-container">{table}</div></div>
         <script>
             $(document).ready(function () {{createOverlay("{name}", "{title}", true);}});
         </script>""".format(name=field.id,
                             change_label=uc_first(_('change')),
                             title=_(field.id.replace('_', ' ')),
                             selection=selection,
                             table=table.display(field.id, remove_rows=False))
     return super(TableMultiSelect, self).__call__(field, **kwargs) + html
示例#12
0
    def __call__(self, field, **kwargs):
        file_stats = None
        place_fields = [
            'residence', 'begins_in', 'ends_in', 'place_to', 'place_from'
        ]
        class_ = 'place' if field.id in place_fields else field.id
        if class_ == 'place':
            aliases = current_user.settings['table_show_aliases']
            entities = EntityMapper.get_by_system_type('place',
                                                       nodes=True,
                                                       aliases=aliases)
        elif class_ == 'reference':
            entities = EntityMapper.get_by_system_type('bibliography') + \
                       EntityMapper.get_by_system_type('edition') + \
                       EntityMapper.get_by_system_type('external reference')
        elif class_ == 'file':
            entities = EntityMapper.get_display_files()
            file_stats = get_file_stats()
        else:
            entities = EntityMapper.get_by_codes(class_)
        selection = ''
        table = Table(Table.HEADERS[class_])

        # Table definitions (aligning)
        if class_ == 'event':
            table.defs += '[{className: "dt-body-right", targets: [3,4]}]'
        elif class_ in ['actor', 'group', 'feature', 'place']:
            table.defs += '[{className: "dt-body-right", targets: [2,3]}]'

        for entity in entities:
            # Todo: don't show self e.g. at source
            if field.data and entity.id == int(field.data):
                selection = entity.name
            data = get_base_table_data(entity, file_stats)
            data[
                0] = """<a onclick="selectFromTable(this,'{name}', {entity_id})">{entity_name}</a>
                        """.format(name=field.id,
                                   entity_id=entity.id,
                                   entity_name=truncate_string(entity.name,
                                                               span=False))
            data[0] = '<br />'.join([data[0]] + [
                truncate_string(alias)
                for id_, alias in entity.aliases.items()
            ])
            table.rows.append(data)
        html = """
            <input id="{name}-button" name="{name}-button" class="table-select {required}"
                type="text" placeholder="{change_label}" onfocus="this.blur()" readonly="readonly"
                value="{selection}">
            <a id="{name}-clear" class="button" {clear_style}
                onclick="clearSelect('{name}');">{clear_label}</a>
            <div id="{name}-overlay" class="overlay">
            <div id="{name}-dialog" class="overlay-container">{table}</div></div>
            <script>$(document).ready(function () {{createOverlay("{name}", "{title}");}});</script>
            """.format(
            name=field.id,
            title=_(field.id.replace('_', ' ')),
            change_label=uc_first(_('change')),
            clear_label=uc_first(_('clear')),
            table=table.display(field.id),
            selection=selection,
            clear_style='' if selection else ' style="display: none;" ',
            required=' required' if field.flags.required else '')
        return super(TableSelect, self).__call__(field, **kwargs) + html
示例#13
0
    def __call__(self, field: TableField, **kwargs: Any) -> TableMultiSelect:
        if field.data and isinstance(field.data, str):
            field.data = ast.literal_eval(field.data)
        class_ = field.id if field.id != 'given_place' else 'place'

        # Make checkbox column sortable and show selected on top
        table = Table([''] + g.table_headers[class_],
                      order=[[0, 'desc'], [1, 'asc']])

        # Table definitions (ordering and aligning)
        table.defs = [{'orderDataType': 'dom-checkbox', 'targets': 0}]
        if class_ == 'event':
            table.defs.append({
                'className': 'dt-body-right',
                'targets': [4, 5]
            })
        elif class_ in ['actor', 'group', 'feature', 'place']:
            table.defs.append({
                'className': 'dt-body-right',
                'targets': [3, 4]
            })

        if class_ in ['group', 'person', 'place']:
            entities = Entity.get_by_class(
                class_,
                nodes=True,
                aliases=current_user.settings['table_show_aliases'])
        else:
            entities = Entity.get_by_view(class_)

        for entity in entities:
            data = get_base_table_data(entity)
            data[0] = re.sub(re.compile('<a.*?>'), '', data[0])  # Remove links
            data.insert(
                0, """<input type="checkbox" id="{id}" {checked} value="{name}"
                class="multi-table-select">""".format(
                    id=str(entity.id),
                    name=entity.name,
                    checked='checked = "checked"'
                    if field.data and entity.id in field.data else ''))
            table.rows.append(data)
        selection = [
            entity.name for entity in entities
            if field.data and entity.id in field.data
        ]
        html = """
            <span
                id="{name}-button"
                class="{button_class}"
                onclick="$('#{name}-modal').modal('show')">
                    {change_label}
            </span><br>
            <div id="{name}-selection" class="selection" style="text-align:left;">{selection}</div>
            <div
                id="{name}-modal"
                class="modal fade"
                tabindex="-1"
                role="dialog"
                aria-hidden="true">
                <div class="modal-dialog" role="document" style="max-width: 100%!important;">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title">{title}</h5>
                            <button
                                type="button"
                                class="btn btn-outline-primary btn-sm"
                                data-dismiss="modal"
                                aria-label="Close">
                                    <span aria-hidden="true">&times;</span>
                            </button>
                        </div>
                        <div class="modal-body">{table}</div>
                        <div class="modal-footer">
                            <button
                                type="button"
                                class="btn btn-outline-primary btn-sm"
                                data-dismiss="modal"
                                onclick="selectFromTableMulti('{name}')">
                                    {close_label}
                            </button>
                        </div>
                    </div>
                </div>
            </div>
            <script>
            </script>""".format(
            name=field.id,
            button_class=app.config['CSS']['button']['secondary'],
            change_label=uc_first(_('change')),
            close_label=uc_first(_('close')),
            title=uc_first(_(field.id.replace('_', ' '))),
            selection='<br>'.join(selection),
            table=table.display(field.id))
        return super(TableMultiSelect, self).__call__(field, **kwargs) + html
示例#14
0
    def __call__(self, field: TableField, **kwargs: Any) -> TableSelect:
        file_stats = None
        place_fields = [
            'residence', 'begins_in', 'ends_in', 'place_to', 'place_from'
        ]
        class_ = 'place' if field.id in place_fields else field.id
        if class_ == 'place':
            aliases = current_user.settings['table_show_aliases']
            entities = Entity.get_by_class('place',
                                           nodes=True,
                                           aliases=aliases)
        elif class_ == 'reference':
            entities = Entity.get_by_class('bibliography') + \
                       Entity.get_by_class('edition') + \
                       Entity.get_by_class('external_reference')
        elif class_ == 'file':
            entities = Entity.get_by_class('file')
        else:
            entities = Entity.get_by_view(class_)
        table = Table([''] + g.table_headers[class_])

        selection = ''
        for entity in entities:
            if field.data and entity.id == int(field.data):
                selection = entity.name
            data = get_base_table_data(entity, file_stats)
            if len(entity.aliases) > 0:
                data[0] = """
                    <p>
                        <a onclick="selectFromTable(this, '{name}', {entity_id}, '{entity_name_clean}')"
                            href="#">{entity_name}</a>
                    </p>""".format(name=field.id,
                                   entity_id=entity.id,
                                   entity_name=entity.name,
                                   entity_name_clean=entity.name.replace(
                                       "'", ''))
            else:
                data[0] = """
                    <a
                        onclick="selectFromTable(this, '{name}', {entity_id}, '{entity_name_clean}')"
                        href="#">{entity_name}</a>
                    """.format(name=field.id,
                               entity_id=entity.id,
                               entity_name=entity.name,
                               entity_name_clean=entity.name.replace("'", ''))
            for i, (id_, alias) in enumerate(entity.aliases.items()):
                if i == len(entity.aliases) - 1:
                    data[0] = ''.join([data[0]] + [alias])
                else:
                    data[0] = ''.join([data[0]] + ['<p>' + alias + '</p>'])
            data.insert(
                0, """
                <div style="position: relative; top: 10px;">
                    <div
                        class="btn btn-outline-primary btn-xsm"
                        style="position: absolute; top: -22px;"
                        onclick="selectFromTable(this,'{name}', {entity_id}, '{entity_name_clean}')">
                            {label}
                    </div>
                </div>
                """.format(name=field.id,
                           entity_id=entity.id,
                           entity_name=entity.name,
                           entity_name_clean=entity.name.replace("'", ''),
                           label=uc_first(_('select'))))
            table.rows.append(data)
        html = """
            <input
                id="{name}-button"
                name="{name}-button"
                class="table-select {required}"
                type="text"
                placeholder="{change_label}"
                onfocus="this.blur()"
                readonly="readonly"
                value="{selection}"
                onclick="$('#{name}-modal').modal('show');">
            <a href="#"
                id="{name}-clear"
                class="{button_class}"
                {clear_style}
                onclick="clearSelect('{name}');">
                    {clear_label}
            </a>
            <div
                id="{name}-modal"
                class="modal fade"
                tabindex="-1"
                role="dialog"
                aria-hidden="true">
                <div class="modal-dialog" role="document" style="max-width: 100%!important;">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title">{title}</h5>
                            <button
                                type="button"
                                class="btn btn-outline-primary btn-sm"
                                data-dismiss="modal"
                                aria-label="Close">
                                    <span aria-hidden="true">&times;</span>
                            </button>
                        </div>
                        <div class="modal-body">{table}</div>
                        <div class="modal-footer">
                            <button
                                type="button"
                                class="btn btn-outline-primary btn-sm"
                                data-dismiss="modal">
                                    {close_label}
                            </button>
                        </div>
                    </div>
                </div>
            </div>
            """.format(
            name=field.id,
            title=uc_first(_(field.id.replace('_', ' '))),
            button_class=app.config['CSS']['button']['secondary'],
            change_label=uc_first(_('change')),
            clear_label=uc_first(_('clear')),
            close_label=uc_first(_('close')),
            table=table.display(field.id),
            selection=selection,
            clear_style='' if selection else ' style="display: none;" ',
            required=' required' if field.flags.required else '')
        return super(TableSelect, self).__call__(field, **kwargs) + html