bibliotheca-php/webclient/view/default/managecollectionfields/managecollectionfields.html

<h3 class="uk-h3"><?php echo $I18n->t('managefields.fieldsfor'); ?> <a href="index.php?p=managecolletions&m=edit&id=<?php echo $TemplateData['editData']['id']; ?>"><?php echo $TemplateData['editData']['name']; ?></a></h3>

<div class="uk-grid-small uk-grid-row-small uk-grid-row-small" uk-grid>
	<div class="uk-width-1-2">
		<h4 class="uk-h4"><?php echo $I18n->t('managefields.addorremove'); ?></h4>
		<p><?php echo $I18n->t('managefields.addorremove.description'); ?></p>
		<div id="collectionFields" uk-sortable="group: sortable-group" class="uk-padding-small uk-padding-remove-left uk-padding-remove-right uk-background-muted">
			<?php foreach($TemplateData['existingFields'] as $k=>$v) { ?>
			<div data-field-id="<?php echo $k; ?>">
				<span class="uk-sortable-handle uk-margin-small-right" uk-icon="icon: table"></span>
				<?php echo $I18n->t($v['displayname']); ?> (<?php echo $v['type'],'; ',$v['identifier']; ?>)
			</div>
			<?php } ?>
		</div>

		<form class="uk-form-horizontal uk-margin-small" method="post" onsubmit="return saveOrderAndSubmit()">
			<input type="hidden" name="fdata[fieldSortString]" id="fieldSort"
			   value="<?php echo $TemplateData['editData']['fieldSortString'] ?? ''; ?>">
			<div class="uk-margin">
				<button class="uk-button uk-button-primary" type="submit" name="submitForm">
					<?php echo $I18n->t('global.save'); ?>
				</button>
			</div>
		</form>
	</div>
	<div class="uk-width-1-2">
		<h4 class="uk-h4"><?php echo $I18n->t('managefields.fieldsavailable'); ?></h4>
		<div uk-sortable="group: sortable-group">
			<?php foreach($TemplateData['availableFields'] as $k=>$v) { ?>
			<div data-field-id="<?php echo $k; ?>">
				<span class="uk-sortable-handle uk-margin-small-right" uk-icon="icon: table"></span>
				<?php echo $I18n->t($v['displayname']); ?> (<?php echo $v['type'],'; ',$v['identifier']; ?>)
			</div>
			<?php } ?>
		</div>
	</div>
</div>

<script type="text/javascript">
	function saveOrderAndSubmit() {
		let list = document.getElementById("collectionFields");
		let fieldSort = document.getElementById("fieldSort");
		let sortString = '';
		if(list && list.children.length > 0 && fieldSort) {
			let fields = Array.from(list.children);
			fields.forEach(function(item, index) {
				sortString += item.getAttribute("data-field-id")+",";
			});
			fieldSort.value = sortString;
			return true;
		}
		return false;
	}
</script>