Import set targets: UI improvments

2 files changed, 55 insertions, 10 deletions

diff --git a/ishtar_common/forms_common.py b/ishtar_common/forms_common.py
index d1358255f..2a443595d 100644
--- a/ishtar_common/forms_common.py
+++ b/ishtar_common/forms_common.py
@@ -203,10 +203,12 @@ class TargetKeyForm(forms.ModelForm):
         fields = ('target', 'key', 'value')
         widgets = {
             'key': forms.TextInput(attrs={'readonly': 'readonly'}),
-            'value': forms.Select(),
         }
     target = widgets.SelectReadonlyField(
         model=models.ImportTarget, label=_(u"Target"))
+    value = widgets.Select2SimpleField(
+        label=_(u"Value"), required=False
+    )
     remember = forms.ChoiceField(label=_(u"Remember"), choices=[],
                                  required=False)
     NULL_VALUE = '<NONE>'
@@ -245,6 +247,7 @@ class TargetKeyForm(forms.ModelForm):
             choices += [('all', _("all users"))]
         self.fields['remember'].choices = choices
         self.fields['remember'].widget.attrs['class'] = 'auto'
+        self.remember_choices = choices
 
     def clean_target(self):
         instance = getattr(self, 'instance', None)
diff --git a/ishtar_common/templates/ishtar/formset_import_match.html b/ishtar_common/templates/ishtar/formset_import_match.html
index f37938771..076cc839a 100644
--- a/ishtar_common/templates/ishtar/formset_import_match.html
+++ b/ishtar_common/templates/ishtar/formset_import_match.html
@@ -1,11 +1,17 @@
 {% extends "base.html" %}
 {% load i18n %}
+{% block extra_head %}
+{{formset.media}}
+{% endblock %}
+{% block pre_container %}
+<form action="." method="post">{% csrf_token %}
+  {% endblock %}
 {% block content %}
 <h2>{{page_name}}</h2>
-<p><a href="{% url 'current_imports' %}">{% trans "Back to import list" %}</a></p>
+  <p class="text-center">
+    <a href="{% url 'current_imports' %}">{% trans "Back to import list" %}</a>
+  </p>
 <div class='form' id='global-vars'>
-<form action="." method="post">{% csrf_token %}
-
   {% if extra_formset.non_form_errors %}
   <div class='errors'>{{extra_formset.non_form_errors.as_ul}}</div>{% endif %}
 
@@ -15,13 +21,23 @@
   <div id="{{formset.prefix}}">
     {% for frm in formset %}{% ifchanged frm.target.value %}
     {# <table> #}{% if not forloop.first%}</table>{% endif %}
-    <table class='clean-table'>
-      <caption>{{ frm.target.field.choices.0.1 }}</caption>
+    <h4>{{ frm.target.field.choices.0.1 }}</h4>
+    <table class='clean-table' id="form-{{forloop.counter0}}">
       <tr>
         <th>{% trans "Key" %}</th>
         <th>{% trans "Value" %}</th>
         <th>{% trans "For" %}</th>
       </tr>
+      <tr>
+        <td colspan="2">
+        </td>
+        <td>
+          <select id="all-remember-{{forloop.counter0}}"><option value="">--</option>
+            {% for key, lbl in frm.remember_choices %}
+            <option value="{{key}}">{{lbl}}</option>{% endfor %}
+          </select>
+        </td>
+      </tr>
     {% endifchanged %}
       <tr>
         <td>
@@ -47,9 +63,35 @@
       {%endfor%}
 
   </div>
-
-<input type="submit" value="{% trans 'Validate' %}"/>
-</form>
 </div>
-<p><a href="{% url 'current_imports' %}">{% trans "Back to import list" %}</a></p>
+<p class="text-center">
+  <a href="{% url 'current_imports' %}">{% trans "Back to import list" %}</a>
+</p>
+  <script type="text/javascript">
+  $(document).ready(function() {{% for frm in formset %}
+    $("#all-remember-{{forloop.counter0}}").change(
+      function(){
+        var cval = $("#all-remember-{{forloop.counter0}}").val();
+        if (cval){
+          $("#form-{{forloop.counter0}} select").val(cval);
+        }
+      }
+    );
+  {% endfor %}
+  });
+  </script>
+{% endblock %}
+{% block footer %}
+<div id="footer">
+  <div id='validation-bar' class="row text-center">
+    <div class="col-sm">
+      <button type="submit" id="submit_form" name='validate'
+              value="validate" class="btn btn-success">
+        {% if submit_label %}{{submit_label}}{% else%}{% trans "Validate" %}{% endif %}
+      </button>
+    </div>
+  </div>
+  {% include 'ishtar/blocks/footer.html' %}
+</div>
+</form>
 {% endblock %}