mirror of
https://github.com/lucaspalomodevelop/core.git
synced 2026-03-13 08:09:41 +00:00
replace tokenize for Tokenize2 in mvc part, only occurrence to go in legacy code. for https://github.com/opnsense/core/issues/2227
This commit is contained in:
parent
c3dc31a793
commit
b0a4a27a1f
@ -35,7 +35,6 @@
|
||||
# advanced : property "is advanced", only display in advanced mode
|
||||
# hint : input control hint
|
||||
# style : css class to add
|
||||
# maxheight : maximum height in rows if applicable
|
||||
# width : width in pixels if applicable
|
||||
# allownew : allow new items (for list) if applicable
|
||||
# readonly : if true, input fields will be readonly
|
||||
@ -59,14 +58,12 @@
|
||||
<input type="checkbox" id="{{ id }}">
|
||||
{% elseif type == "select_multiple" %}
|
||||
<select multiple="multiple"
|
||||
{% if size|default(false) %}size="{{size}}"{% endif %}
|
||||
{% if size|default(false) %}data-size="{{size}}"{% endif %}
|
||||
id="{{ id }}"
|
||||
class="{{style|default('selectpicker')}}"
|
||||
{% if hint|default(false) %}data-hint="{{hint}}"{% endif %}
|
||||
{% if maxheight|default(false) %}data-maxheight="{{maxheight}}"{% endif %}
|
||||
data-width="{{width|default("334px")}}"
|
||||
data-allownew="{{allownew|default("false")}}"
|
||||
data-nbdropdownelements="{{nbDropdownElements|default("10")}}"
|
||||
data-live-search="true"
|
||||
{% if separator|default(false) %}data-separator="{{separator}}"{% endif %}
|
||||
></select>
|
||||
|
||||
@ -164,12 +164,7 @@
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
<!-- JQuery Tokenize (http://zellerda.com/projects/tokenize) -->
|
||||
<script src="/ui/js/jquery.tokenize.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="{{theme_file_or_default('/css/jquery.tokenize.css', theme_name)}}" />
|
||||
|
||||
<!-- JQuery Tokenize2 (https://zellerda.github.io/Tokenize2/) -->
|
||||
<!-- JQuery Tokenize2 (https://zellerda.github.io/Tokenize2/) -->
|
||||
<script src="/ui/js/tokenize2.min.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="{{theme_file_or_default('/css/tokenize2.css', theme_name)}}" rel="stylesheet" />
|
||||
|
||||
|
||||
@ -199,34 +199,56 @@ function updateServiceControlUI(serviceName)
|
||||
* reformat all tokenizers on this document
|
||||
*/
|
||||
function formatTokenizersUI() {
|
||||
$('select[class="tokenize"]').each(function () {
|
||||
if ($(this).prop("size")==0) {
|
||||
maxDropdownHeight=String(36*5)+"px"; // default number of items
|
||||
$('select.tokenize').each(function () {
|
||||
var sender = $(this);
|
||||
if (!sender.hasClass('tokenize2_init_done')) {
|
||||
// only init tokenize2 when not bound yet
|
||||
var hint = $(this).data("hint");
|
||||
var width = $(this).data("width");
|
||||
if (sender.data("size") != undefined) {
|
||||
var number_of_items = $(this).data("size");
|
||||
} else {
|
||||
var number_of_items = 10;
|
||||
}
|
||||
var allownew = $(this).data("allownew");
|
||||
sender.tokenize2({
|
||||
'tokensAllowCustom': allownew,
|
||||
'placeholder': hint,
|
||||
'dropdownMaxItems': number_of_items
|
||||
});
|
||||
sender.parent().find('ul.tokens-container').parent().css("width", width);
|
||||
|
||||
// dropdown on focus (previous displayDropdownOnFocus)
|
||||
sender.on('tokenize:select', function(container){
|
||||
$(this).tokenize2().trigger('tokenize:search', [$(this).tokenize2().input.val()]);
|
||||
});
|
||||
// bind add / remove events
|
||||
sender.on('tokenize:tokens:add', function(e, value){
|
||||
sender.trigger("tokenize:tokens:change");
|
||||
});
|
||||
sender.on('tokenize:tokens:remove', function(e, value){
|
||||
sender.trigger("tokenize:tokens:change");
|
||||
});
|
||||
|
||||
sender.addClass('tokenize2_init_done');
|
||||
} else {
|
||||
number_of_items = $(this).prop("size");
|
||||
maxDropdownHeight=String(36*number_of_items)+"px";
|
||||
}
|
||||
hint=$(this).data("hint");
|
||||
width=$(this).data("width");
|
||||
allownew=$(this).data("allownew");
|
||||
nbDropdownElements=$(this).data("nbdropdownelements");
|
||||
maxTokenContainerHeight=$(this).data("maxheight");
|
||||
// unbind change event while loading initial content
|
||||
sender.unbind('tokenize:tokens:change');
|
||||
|
||||
$tokenizer = $(this).tokenize({
|
||||
displayDropdownOnFocus: true,
|
||||
newElements: allownew,
|
||||
nbDropdownElements: nbDropdownElements,
|
||||
placeholder:hint
|
||||
// re-init tokenizer items
|
||||
var items = $(this).val();
|
||||
sender.tokenize2().trigger('tokenize:clear');
|
||||
$.each(items, function(key, item){
|
||||
sender.tokenize2().trigger('tokenize:tokens:add', item);
|
||||
});
|
||||
sender.tokenize2().trigger('tokenize:select');
|
||||
}
|
||||
|
||||
// propagate token changes to parent change()
|
||||
sender.on('tokenize:tokens:change', function(e, value){
|
||||
sender.change();
|
||||
});
|
||||
$tokenizer.resizeSearchInput();
|
||||
$tokenizer.remap(true);
|
||||
$tokenizer.updatePlaceholder();
|
||||
|
||||
$(this).parent().find('ul[class="TokensContainer"]').parent().css("width",width);
|
||||
$(this).parent().find('ul[class="Dropdown"]').css("max-height", maxDropdownHeight);
|
||||
if ( maxDropdownHeight != undefined ) {
|
||||
$(this).parent().find('ul[class="TokensContainer"]').css("max-height", maxTokenContainerHeight);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user