Make live-search into a component

This commit is contained in:
Tom Byers
2018-08-15 20:13:49 +01:00
parent 71be0eaeb4
commit 47798b218c
7 changed files with 31 additions and 31 deletions

View File

@@ -0,0 +1,21 @@
{% from "components/textbox.html" import textbox %}
{% macro live_search(
target_selector=None,
show=False,
form=None,
label=None
) %}
{%- set search_label = label or form.search.label.text %}
{% if show %}
<div data-module="autofocus">
<div class="live-search" data-module="live-search" data-targets="{{ target_selector }}">
{{ textbox(
form.search,
width='1-1',
label=search_label
) }}
</div>
</div>
{% endif %}
{% endmacro %}

View File

@@ -3,6 +3,7 @@
{% from "components/page-footer.html" import page_footer %}
{% from "components/tick-cross.html" import tick_cross %}
{% from "components/textbox.html" import textbox %}
{% from "components/live-search.html" import live_search %}
{% set table_options = {
'field_headings': [
@@ -33,12 +34,7 @@
{% if show_search_box %}
<div data-module="autofocus">
<div class="live-search" data-module="live-search" data-targets=".user-list-item">
{{ textbox(
form.search,
width='1-1'
) }}
</div>
{{ live_search(target_selector='.user-list-item', show=True, form=form) }}
</div>
{% endif %}

View File

@@ -3,6 +3,7 @@
{% from "components/page-footer.html" import page_footer %}
{% from "components/tick-cross.html" import tick_cross %}
{% from "components/textbox.html" import textbox %}
{% from "components/live-search.html" import live_search %}
{% block org_page_title %}
Team members
@@ -23,12 +24,7 @@
{% if show_search_box %}
<div data-module="autofocus">
<div class="live-search" data-module="live-search" data-targets=".user-list-item">
{{ textbox(
form.search,
width='1-1'
) }}
</div>
{{ live_search(target_selector='.user-list-item', show=True, form=form) }}
</div>
{% endif %}

View File

@@ -1,5 +1,6 @@
{% from "components/table.html" import mapping_table, row, text_field, field, row_heading %}
{% from "components/textbox.html" import textbox %}
{% from "components/live-search.html" import live_search %}
{% extends "withoutnav_template.html" %}
@@ -62,13 +63,7 @@
<details>
<summary>International text message rates</summary>
<div class="live-search" data-module="live-search" data-targets="#international-pricing .table-row">
{{ textbox(
search_form.search,
width='1-1',
label='Search by country name or code'
) }}
</div>
{{ live_search(target_selector='#international-pricing .table-row', show=True, form=search_form, label='Search by country name or code') }}
<div id="international-pricing" class="bottom-gutter-3-2">
{% call mapping_table(

View File

@@ -1,10 +0,0 @@
{% if show_search_box %}
<div data-module="autofocus">
<div class="live-search" data-module="live-search" data-targets="#template-list .column-whole">
{{ textbox(
search_form.search,
width='1-1'
) }}
</div>
</div>
{% endif %}

View File

@@ -1,6 +1,7 @@
{% from "components/pill.html" import pill %}
{% from "components/message-count-label.html" import message_count_label %}
{% from "components/textbox.html" import textbox %}
{% from "components/live-search.html" import live_search %}
{% extends "withnav_template.html" %}
@@ -28,7 +29,7 @@
{% else %}
{% include "views/templates/_search-box.html" %}
{{ live_search(target_selector='#template-list .column-whole', show=show_search_box, form=search_form) }}
<nav class="grid-row" id=template-list>
{% for template in templates %}

View File

@@ -1,6 +1,7 @@
{% from "components/pill.html" import pill %}
{% from "components/message-count-label.html" import message_count_label %}
{% from "components/textbox.html" import textbox %}
{% from "components/live-search.html" import live_search %}
{% extends "withnav_template.html" %}
@@ -55,7 +56,7 @@
</div>
{% endif %}
{% include "views/templates/_search-box.html" %}
{{ live_search(target_selector='#template-list .column-whole', show=show_search_box, form=search_form) }}
<nav class="grid-row" id=template-list>
{% for template in templates %}