dashboard/src/templates/dashboard/genericselect.html

   1 {% extends "workflow/viewport-element.html" %}
   2 {% load staticfiles %}
   3
   4 {% load bootstrap4 %}
   5
   6 {% block content %}
   7
   8 <style>
   9     #page-wrapper {
  10         display: flex;
  11         flex-direction: column;
  12     }
  13
  14     #{{select_type}}_form_div div {
  15     }
  16
  17     #{{select_type}}_form_div > * {
  18         margin-left: 10px;
  19         margin-right: 10px;
  20         margin-bottom: 20px;
  21     }
  22
  23     #{{select_type}}_form_div div * {
  24     }
  25
  26     #{{select_type}}_form_div {
  27         flex: 1;
  28         margin: 30px;
  29         display: flex;
  30         flex-direction: column;
  31     }
  32
  33     #select_section {
  34         flex: 1;
  35         display: flex;
  36         flex-direction: column;
  37     }
  38
  39     #{{select_type}}_select_form {
  40         flex: 1;
  41         display: flex;
  42         flex-direction: column;
  43     }
  44
  45     .autocomplete {
  46         flex: 1;
  47     }
  48
  49     #create_section {
  50     }
  51
  52     #select_header_section {
  53     }
  54
  55     h3 {
  56         margin-top: 0;
  57         margin-bottom: 0;
  58         vertical-align: middle;
  59     }
  60
  61     .divider {
  62         border-top: 1px solid #ccc;
  63     }
  64
  65
  66 </style>
  67
  68 <div id="{{select_type}}_form_div">
  69     <h3 id="create_section">Create a Resource
  70         <button class="btn btn-primary {% if disabled %} disabled {% endif %}"
  71             {% if not disabled %}onclick="parent.add_wf({{addable_type_num}})"
  72             {% endif %}>Here
  73         </button>
  74     </h3>
  75     <div class="divider"></div>
  76     <h3 id="select_header_section">Or select from the list below:</h3>
  77     <div id="select_section">
  78         <form id="{{select_type}}_select_form" method="post" action="" class="form" id="{{select_type}}selectorform">
  79         {% csrf_token %}
  80         {{ form|default:"<p>no form loaded</p>" }}
  81         {% buttons %}
  82
  83         {% endbuttons %}
  84         </form>
  85     </div>
  86 </div>
  87
  88 <script>
  89     {% if disabled %}
  90     disable();
  91     {% endif %}
  92 </script>
  93
  94 {% endblock content %}
  95 {% block onleave %}
  96 var form = $("#{{select_type}}_select_form");
  97 var formData = form.serialize();
  98 var req = new XMLHttpRequest();
  99 req.open("POST", "/wf/workflow/", false);
 100 req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
 101 req.onerror = function() { alert("problem with form submission"); }
 102 req.send(formData);
 103 {% endblock %}
 104