mirror_php/formwork
1
0
Fork 0
mirror of https://github.com/getformwork/formwork.git synced 2025-02-24 17:52:41 +01:00
Code Issues Packages Projects Releases Wiki Activity

Add placeholder support for tags field

Browse Source
This commit is contained in:
Giuseppe Criscione 2019-05-07 17:42:27 +02:00
parent 5fbe3e1dfc
commit a87b9d2371
4 changed files with 58 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
admin/assets/js/app.js
View File

@ -1438,6 +1438,21 @@ Formwork.Utils = {
function _update($input) {
var $parent = $input.parent();
$('.tag-hidden-input', $parent).val($parent.data('tags').join(', '));
_placeholder($input);
}
function _placeholder($input) {
var $parent = $input.parent();
var placeholder = $input.data('placeholder');
if (placeholder.length > 0) {
if ($parent.data('tags').length === 0) {
$input.attr('placeholder', placeholder);
$input.prop('size', placeholder.length);
} else {
$input.attr('placeholder', '');
$input.prop('size', 1);
}
}
}
function _createTag($input, value) {
@ -1468,6 +1483,7 @@ Formwork.Utils = {
var $target = $('.tag-hidden-input', $this);
var $input = $('.tag-inner-input', $this);
var tags = [];
if ($target.val()) {
tags = $target.val().split(', ');
$.each(tags, function (index, value) {
@ -1476,6 +1492,7 @@ Formwork.Utils = {
_createTag($input, value);
});
}
$this.data('tags', tags)
.on('mousedown', '.tag-remove', false)
.on('click', '.tag-remove', function () {
@ -1484,6 +1501,13 @@ Formwork.Utils = {
$tag.remove();
return false;
});
if ($input.attr('placeholder') !== undefined) {
$input.data('placeholder', $input.attr('placeholder'));
_placeholder($input);
} else {
$input.data('placeholder', '');
}
});
this.on('mousedown', function () {
@ -1498,7 +1522,6 @@ Formwork.Utils = {
var value = $this.val().trim();
if (value !== '') {
addTag($this, value);
$this.prop('size', 1);
}
$this.parent().removeClass('focused');
}).on('keydown', function (event) {
@ -1511,25 +1534,24 @@ Formwork.Utils = {
if (value === '') {
removeTag($this, $this.prev().text());
$this.prev().remove();
$this.prop('size', 1);
return false;
}
$this.prop('size', Math.max($this.val().length, 1));
$this.prop('size', Math.max($this.val().length, $this.attr('placeholder').length, 1));
return true;
case 13: // enter
case 188: // comma
if (value !== '') {
addTag($this, value);
}
$this.prop('size', 1);
return false;
default:
if (value !== '' && options.addKeyCodes.indexOf(event.which) > -1) {
addTag($this, value);
$this.prop('size', 1);
return false;
}
$this.prop('size', $this.val().length + 2);
if (value.length > 0) {
$this.prop('size', $this.val().length + 2);
}
break;
}

2
admin/assets/js/app.min.js vendored
View File

File diff suppressed because one or more lines are too long

34
admin/assets/js/src/plugins/taginput.js
View File

@ -4,6 +4,21 @@
function _update($input) {
var $parent = $input.parent();
$('.tag-hidden-input', $parent).val($parent.data('tags').join(', '));
_placeholder($input);
}
function _placeholder($input) {
var $parent = $input.parent();
var placeholder = $input.data('placeholder');
if (placeholder.length > 0) {
if ($parent.data('tags').length === 0) {
$input.attr('placeholder', placeholder);
$input.prop('size', placeholder.length);
} else {
$input.attr('placeholder', '');
$input.prop('size', 1);
}
}
}
function _createTag($input, value) {
@ -34,6 +49,7 @@
var $target = $('.tag-hidden-input', $this);
var $input = $('.tag-inner-input', $this);
var tags = [];
if ($target.val()) {
tags = $target.val().split(', ');
$.each(tags, function (index, value) {
@ -42,6 +58,7 @@
_createTag($input, value);
});
}
$this.data('tags', tags)
.on('mousedown', '.tag-remove', false)
.on('click', '.tag-remove', function () {
@ -50,6 +67,13 @@
$tag.remove();
return false;
});
if ($input.attr('placeholder') !== undefined) {
$input.data('placeholder', $input.attr('placeholder'));
_placeholder($input);
} else {
$input.data('placeholder', '');
}
});
this.on('mousedown', function () {
@ -64,7 +88,6 @@
var value = $this.val().trim();
if (value !== '') {
addTag($this, value);
$this.prop('size', 1);
}
$this.parent().removeClass('focused');
}).on('keydown', function (event) {
@ -77,25 +100,24 @@
if (value === '') {
removeTag($this, $this.prev().text());
$this.prev().remove();
$this.prop('size', 1);
return false;
}
$this.prop('size', Math.max($this.val().length, 1));
$this.prop('size', Math.max($this.val().length, $this.attr('placeholder').length, 1));
return true;
case 13: // enter
case 188: // comma
if (value !== '') {
addTag($this, value);
}
$this.prop('size', 1);
return false;
default:
if (value !== '' && options.addKeyCodes.indexOf(event.which) > -1) {
addTag($this, value);
$this.prop('size', 1);
return false;
}
$this.prop('size', $this.val().length + 2);
if (value.length > 0) {
$this.prop('size', $this.val().length + 2);
}
break;
}

2
admin/views/fields/tags.php
View File

@ -1,5 +1,5 @@
<?php if ($field->has('label')): ?><label for="<?= $field->name() ?>"><?= $field->label() ?></label><?php endif; ?>
<div class="tag-input<?php if ($field->get('disabled')): ?> disabled<?php endif; ?>">
<input class="tag-inner-input" id="<?= $field->name() ?>" type="text" size="1"<?php if ($field->get('disabled')): ?> disabled<?php endif; ?>>
<input class="tag-inner-input" id="<?= $field->name() ?>" type="text" size="" placeholder="<?= $field->placeholder() ?>"<?php if ($field->get('disabled')): ?> disabled<?php endif; ?>>
<input class="tag-hidden-input" name="<?= $field->formName() ?>" hidden readonly value="<?= implode(', ', (array) $field->value()) ?>"<?php if ($field->get('required')): ?> required<?php endif; ?><?php if ($field->get('disabled')): ?> disabled<?php endif; ?>>
</div>