aboutsummaryrefslogtreecommitdiffstats
path: root/src/templates/dashboard/searchable_select_multiple.html
diff options
context:
space:
mode:
authorSawyer Bergeron <sbergeron@iol.unh.edu>2019-05-23 13:30:37 -0400
committerSawyer Bergeron <sbergeron@iol.unh.edu>2019-05-31 15:57:34 -0400
commit63bec7d84cbf1acd3a9a357b58b47584b1701229 (patch)
treecc3f73730dce486752b1380b53d09309a0bfe243 /src/templates/dashboard/searchable_select_multiple.html
parenta8d84499905504da229d1e8829145bf2d8329dd9 (diff)
Refactor selector step logic
Change-Id: I61e361e63da7453b2eee0e0c162a6f4e48460128 Signed-off-by: Sawyer Bergeron <sbergeron@iol.unh.edu>
Diffstat (limited to 'src/templates/dashboard/searchable_select_multiple.html')
-rw-r--r--src/templates/dashboard/searchable_select_multiple.html70
1 files changed, 29 insertions, 41 deletions
diff --git a/src/templates/dashboard/searchable_select_multiple.html b/src/templates/dashboard/searchable_select_multiple.html
index c08fbe5..69394ab 100644
--- a/src/templates/dashboard/searchable_select_multiple.html
+++ b/src/templates/dashboard/searchable_select_multiple.html
@@ -7,9 +7,10 @@
<p>Please make a different selection, as the current config conflicts with the selected pod</p>
{% endif %}
</div>
- <input id="user_field" name="ignore_this" class="form-control" autocomplete="off" type="text" placeholder="{{placeholder}}" value="{{initial.name}}" oninput="search(this.value)"
+ <input id="user_field" name="ignore_this" class="form-control" autocomplete="off" type="text" placeholder="{{placeholder}}" value="" oninput="search(this.value)"
{% if disabled %} disabled {% endif %}
>
+ </input>
<input type="hidden" id="selector" name="{{ name }}" class="form-control" style="display: none;"
{% if disabled %} disabled {% endif %}
@@ -18,14 +19,6 @@
<ul id="drop_results"></ul>
-
- <div id="default_entry_wrap" style="display: none;">
- <div class="list_entry unremovable_list_entry">
- <p id="default_text" class="full_name"></p>
- <button class="btn-remove btn disabled">remove</button>
- </div>
- </div>
-
<div id="added_list">
</div>
@@ -96,16 +89,32 @@
<script type="text/javascript">
//flags
- var show_from_noentry = {{show_from_noentry|default:"false"}};
- var show_x_results = {{show_x_results|default:-1}};
- var results_scrollable = {{results_scrollable|default:"false"}};
- var selectable_limit = {{selectable_limit|default:-1}};
- var field_name = "{{name|default:"users"}}";
- var placeholder = "{{placeholder|default:"begin typing"}}";
- var default_entry = "{{default_entry}}";
+ var show_from_noentry = {{show_from_noentry|yesno:"true,false"}}; // whether to show any results before user starts typing
+ var show_x_results = {{show_x_results|default:-1}}; // how many results to show at a time, -1 shows all results
+ var results_scrollable = {{results_scrollable|yesno:"true,false"}}; // whether list should be scrollable
+ var selectable_limit = {{selectable_limit|default:-1}}; // how many selections can be made, -1 allows infinitely many
+ var placeholder = "{{placeholder|default:"begin typing"}}"; // placeholder that goes in text box
//needed info
- var items = {{items|safe}}
+ var items = {{items|safe}} // items to add to trie. Type is a dictionary of dictionaries with structure:
+ /*
+ {
+ id# : {
+ "id": any, identifiable on backend
+ "small_name": string, displayed first (before separator), searchable (use for e.g. username)
+ "expanded_name": string, displayed second (after separator), searchable (use for e.g. email address)
+ "string": string, not displayed, still searchable
+ }
+ }
+ */
+
+ /* used later:
+ {{ selectable_limit }}: changes what number displays for field
+ {{ name }}: form identifiable name, relevant for backend
+ // when submitted, form will contain field data in post with name as the key
+ {{ placeholder }}: "greyed out" contents put into search field initially to guide user as to what they're searching for
+ {{ initial }}: in search_field_init(), marked safe, an array of id's each referring to an id from items
+ */
//tries
var expanded_name_trie = {}
@@ -116,18 +125,6 @@
string_trie.isComplete = false;
var added_items = [];
- var initial_log = {{ initial|safe }};
-
- var added_template = {{ added_list|default:"{}" }};
-
- if( default_entry )
- {
- var default_entry_div = document.getElementById("default_entry_wrap");
- default_entry_div.style.display = "inherit";
-
- var entry_p = document.getElementById("default_text");
- entry_p.innerText = default_entry;
- }
search_field_init();
@@ -335,7 +332,7 @@
function select_item(item_id)
{
//TODO make faster
- var item = items[item_id];
+ var item = items[item_id]['id'];
if( (selectable_limit > -1 && added_items.length < selectable_limit) || selectable_limit < 0 )
{
if( added_items.indexOf(item) == -1 )
@@ -357,11 +354,6 @@
document.getElementById("user_field").focus();
}
- function edit_item(item_id){
- var wf_type = "{{wf_type}}";
- parent.add_edit_wf(wf_type, item_id);
- }
-
function update_selected_list()
{
document.getElementById("added_number").innerText = added_items.length;
@@ -382,7 +374,8 @@
for( var key in added_items )
{
- item = added_items[key];
+ item_id = added_items[key];
+ item = items[item_id];
list_html += '<div class="list_entry"><p class="full_name">'
+ item["expanded_name"]
@@ -391,11 +384,6 @@
+ '</p><button onclick="remove_item('
+ Object.values(items).indexOf(item)
+ ')" class="btn-remove btn">remove</button>';
- {% if edit %}
- list_html += '<button onclick="edit_item('
- + item['id']
- + ')" class="btn-remove btn">edit</button>';
- {% endif %}
list_html += '</div>';
}