Initial working version with minor bugs

templates/includes/card_multiselect.html

@@ -0,0 +1,29 @@
+{% load cache card_badge %}
+<label for="{{ field_id }}" class="form-label">{{ label }}</label>
+<select name="{{ field_name }}" id="{{ field_id }}" class="form-select select2-field" data-placeholder="{{ placeholder }}" multiple="multiple">
+  {% cache cache_timeout cache_key %}
+    <option value="" disabled="disabled">{{ placeholder }}</option>
+    {% for card in available_cards %}
+      <option value="{{ card.pk }}"
+              data-name="{{ card.name }}"
+              data-rarity="{{ card.rarity.icons }}"
+              data-cardset="{{ card.cardset.name }}"
+              data-style="{{ card.style }}"
+        {{ card.name }} {{ card.rarity.icons }} {{ card.cardset.name }}
+      </option>
+    {% endfor %}
+  {% endcache %}
+</select> 
+
+<script>
+  $(document).ready(function () {
+    $('#{{ field_id }}').select2({
+      placeholder: $('#{{ field_id }}').data('placeholder'),
+      templateResult: formatOption,
+      templateSelection: formatOption,
+      width: '100%',
+      dropdownAutoWidth: true,
+      allowClear: true
+    });
+  });
+</script>