lib/templates/url_select.mustache

   1 {{!
   2     @template core/url_select
   3
   4     Example context (json):
   5     {
   6         "id": "url_select_test",
   7         "action": "https://example.com/post",
   8         "formid": "url_select_form",
   9         "sesskey": "sesskey",
  10         "label": "core/url_select",
  11         "helpicon": {
  12             "title": "Help with something",
  13             "text": "Help with something",
  14             "url": "http://example.org/help",
  15             "linktext": "",
  16             "icon":{
  17                 "extraclasses": "iconhelp",
  18                 "attributes": [
  19                     {"name": "src", "value": "../../../pix/help.svg"},
  20                     {"name": "alt", "value": "Help icon"}
  21                 ]
  22             }
  23         },
  24         "showbutton": "Go",
  25         "options": [{
  26             "name": "Group 1", "isgroup": true, "options":
  27             [
  28                 {"name": "Item 1", "isgroup": false, "value": "1"},
  29                 {"name": "Item 2", "isgroup": false, "value": "2"}
  30             ]},
  31             {"name": "Group 2", "isgroup": true, "options":
  32             [
  33                 {"name": "Item 3", "isgroup": false, "value": "3"},
  34                 {"name": "Item 4", "isgroup": false, "value": "4"}
  35             ]}],
  36         "disabled": false,
  37         "title": "Some cool title"
  38     }
  39 }}
  40 <div class="{{classes}}">
  41     <form method="post" action="{{action}}" class="form-inline" id="{{formid}}">
  42         <input type="hidden" name="sesskey" value="{{sesskey}}">
  43         {{#label}}
  44             <label for="{{id}}"{{#labelattributes}} {{name}}="{{value}}"{{/labelattributes}}>
  45                 {{label}}
  46             </label>
  47         {{/label}}
  48         {{#helpicon}}
  49             {{>core/help_icon}}
  50         {{/helpicon}}
  51         <select {{#attributes}}{{name}}="{{value}}" {{/attributes}} id="{{id}}" class="custom-select {{classes}}" name="jump"
  52                 {{#title}}title="{{.}}"{{/title}} {{#disabled}}disabled{{/disabled}}>
  53             {{#options}}
  54                 {{#isgroup}}
  55                     <optgroup label="{{name}}">
  56                         {{#options}}
  57                             <option value="{{value}}" {{#selected}}selected{{/selected}}>{{{name}}}</option>
  58                         {{/options}}
  59                     </optgroup>
  60                 {{/isgroup}}
  61                 {{^isgroup}}
  62                     <option value="{{value}}" {{#selected}}selected{{/selected}}>{{{name}}}</option>
  63                 {{/isgroup}}
  64             {{/options}}
  65         </select>
  66         {{#showbutton}}
  67             <input type="submit" class="btn btn-secondary" value="{{showbutton}}">
  68         {{/showbutton}}
  69         {{^showbutton}}
  70             <noscript>
  71                 <input type="submit" class="btn btn-secondary" value="{{#str}}go, core{{/str}}">
  72             </noscript>
  73         {{/showbutton}}
  74     </form>
  75 </div>
  76 {{^showbutton}}
  77     {{#js}}
  78         require(['jquery'], function($) {
  79             $('#{{id}}').change(function() {
  80                 if (!$(this).val()) {
  81                     return false;
  82                 }
  83                 $('#{{formid}}').submit();
  84             });
  85         });
  86     {{/js}}
  87 {{/showbutton}}