Commit 0c9c9c1d authored by Marc Egger's avatar Marc Egger
Browse files

Merge branch 'B10117TypeAheadAfterSaveJSONIsShown' into F9517TagInput

parents e7a38727 2890924b
...@@ -79,6 +79,7 @@ var QfqNS = QfqNS || {}; ...@@ -79,6 +79,7 @@ var QfqNS = QfqNS || {};
$element.attr(attributeName, attributeValue); $element.attr(attributeName, attributeValue);
if (attributeName.toLowerCase() === "value") { if (attributeName.toLowerCase() === "value") {
$element.val(attributeValue); $element.val(attributeValue);
$element.trigger('qfqChange');
} }
}; };
......
...@@ -62,9 +62,16 @@ var QfqNS = QfqNS || {}; ...@@ -62,9 +62,16 @@ var QfqNS = QfqNS || {};
var suggestions = new Bloodhound(bloodhoundConfiguration); var suggestions = new Bloodhound(bloodhoundConfiguration);
suggestions.initialize(); suggestions.initialize();
// create actual input field
var $inputField = $('<input/>', {
type: 'text',
class: $element.attr('class')
});
$element.after($inputField);
// prevent form submit when enter key is pressed // prevent form submit when enter key is pressed
$element.off('keyup'); $inputField.off('keyup');
$element.on('keypress keyup', function (e) { $inputField.on('keypress keyup', function (e) {
var code = e.keyCode || e.which; var code = e.keyCode || e.which;
if (code === 13) { if (code === 13) {
e.preventDefault(); e.preventDefault();
...@@ -91,9 +98,9 @@ var QfqNS = QfqNS || {}; ...@@ -91,9 +98,9 @@ var QfqNS = QfqNS || {};
}; };
// initialize tagsManager // initialize tagsManager
var tagApi = $element.tagsManager({ var tagApi = $inputField.tagsManager({
deleteTagsOnBackspace: false, deleteTagsOnBackspace: false,
hiddenTagListName: $element.attr('name'), hiddenTagListName: '',
tagClass: 'qfq-typeahead-tag', tagClass: 'qfq-typeahead-tag',
delimiters: delimiters, delimiters: delimiters,
validator: !!$element.data('typeahead-pedantic') ? pedanticValidator : null, validator: !!$element.data('typeahead-pedantic') ? pedanticValidator : null,
...@@ -110,13 +117,21 @@ var QfqNS = QfqNS || {}; ...@@ -110,13 +117,21 @@ var QfqNS = QfqNS || {};
}); });
// when the hidden input field changes, overwrite value with tag object list // when the hidden input field changes, overwrite value with tag object list
tagApi.bind('tm:hiddenUpdate', function (e, tags, hiddenInput) { tagApi.bind('tm:hiddenUpdate', function (e, tags) {
var tagObjects = $.map(tags, function (t) { var tagObjects = $.map(tags, function (t) {
return existingTags.filter(function (tt) {return tt.value === t;})[0]; return existingTags.filter(function (tt) {return tt.value === t;})[0];
}); });
hiddenInput.val(JSON.stringify(tagObjects)); $element.val(JSON.stringify(tagObjects));
});
// if value of hidden field is changed externally, update tagManager
$element.on('qfqChange', function () {
existingTags = $element.val() !== '' ? JSON.parse($element.val()) : [];
tagApi.tagsManager('empty');
$.each(existingTags, function (i, tag) {
tagApi.tagsManager('pushTag', tag.value);
});
}); });
$element.removeAttr('name');
// add existing tags // add existing tags
$.each(existingTags, function (i, tag) { $.each(existingTags, function (i, tag) {
...@@ -124,7 +139,7 @@ var QfqNS = QfqNS || {}; ...@@ -124,7 +139,7 @@ var QfqNS = QfqNS || {};
}); });
// add typahead // add typahead
$element.typeahead({ $inputField.typeahead({
// options // options
hint: n.TypeAhead.getHint($element), hint: n.TypeAhead.getHint($element),
highlight: n.TypeAhead.getHighlight($element), highlight: n.TypeAhead.getHighlight($element),
...@@ -140,20 +155,20 @@ var QfqNS = QfqNS || {}; ...@@ -140,20 +155,20 @@ var QfqNS = QfqNS || {};
// No message if field is not set to pedantic. // No message if field is not set to pedantic.
notFound: (function ($_) { notFound: (function ($_) {
return function (obj) { return function (obj) {
if (!!$_.data('typeahead-pedantic')) if (!!$element.data('typeahead-pedantic'))
return "<div>'" + n.TypeAhead.htmlEncode(obj.query) + "' not found"; return "<div>'" + n.TypeAhead.htmlEncode(obj.query) + "' not found";
}; };
})($element) })($inputField)
} }
}); });
// directly add tag when clicked on in typahead menu // directly add tag when clicked on in typahead menu
$element.bind('typeahead:selected', function (event, sugg) { $inputField.bind('typeahead:selected', function (event, sugg) {
tagApi.tagsManager("pushTag", sugg.value); tagApi.tagsManager("pushTag", sugg.value);
}); });
// update typahead list when typahead changes // update typahead list when typahead changes
$element.bind('typeahead:render', function (event, sugg) { $inputField.bind('typeahead:render', function (event, sugg) {
typeaheadList.length = 0; typeaheadList.length = 0;
typeaheadList.push.apply(typeaheadList, sugg); typeaheadList.push.apply(typeaheadList, sugg);
}); });
......
...@@ -141,7 +141,7 @@ ...@@ -141,7 +141,7 @@
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<input id="tags1" type="text" class="form-control qfq-typeahead" name="tags1" <input id="tags1" type="hidden" class="form-control qfq-typeahead" name="tags1"
data-typeahead-sip="abcdef" data-typeahead-sip="abcdef"
data-typeahead-limit="10" data-typeahead-limit="10"
data-typeahead-minlength="1" data-typeahead-minlength="1"
...@@ -160,7 +160,7 @@ ...@@ -160,7 +160,7 @@
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<input id="tags2" type="text" class="form-control qfq-typeahead" name="tags2" <input id="tags2" type="hidden" class="form-control qfq-typeahead" name="tags2"
data-typeahead-sip="abcdef" data-typeahead-sip="abcdef"
data-typeahead-limit="10" data-typeahead-limit="10"
data-typeahead-minlength="1" data-typeahead-minlength="1"
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment