0a0935266be91da7af9949612af52658a3d6a2f1
[Packages/TYPO3.CMS.git] / typo3 / sysext / backend / Resources / Public / JavaScript / FormEngineSuggest.js
1 /*
2 * This file is part of the TYPO3 CMS project.
3 *
4 * It is free software; you can redistribute it and/or modify it under
5 * the terms of the GNU General Public License, either version 2
6 * of the License, or any later version.
7 *
8 * For the full copyright and license information, please read the
9 * LICENSE.txt file that was distributed with this source code.
10 *
11 * The TYPO3 project - inspiring people to share!
12 */
13
14 /**
15 * Module: TYPO3/CMS/Backend/FormEngineSuggest
16 * Functionality to load suggest functionality
17 */
18 define(['jquery', 'jquery/autocomplete'], function ($) {
19 var initialize = function($searchField) {
20 var $containerElement = $searchField.closest('.t3-form-suggest-container');
21 var table = $searchField.data('table'),
22 field = $searchField.data('field'),
23 uid = $searchField.data('uid'),
24 pid = $searchField.data('pid'),
25 newRecordRow = $searchField.data('recorddata'),
26 minimumCharacters = $searchField.data('minchars'),
27 url = TYPO3.settings.ajaxUrls['record_suggest'],
28 params = {
29 'table': table,
30 'field': field,
31 'uid': uid,
32 'pid': pid,
33 'newRecordRow': newRecordRow
34 },
35 insertValue = function(element) {
36 var insertData = '';
37 if ($searchField.data('fieldtype') === 'select') {
38 insertData = $(element).data('uid');
39 } else {
40 insertData = $(element).data('table') + '_' + $(element).data('uid');
41 }
42
43 var formEl = $searchField.data('fieldname');
44 var labelEl = $('<div>').html($(element).data('label'));
45 var label = labelEl.text();
46 var title = labelEl.find('span').attr('title') || label;
47 setFormValueFromBrowseWin(formEl, insertData, label, title);
48 TBE_EDITOR.fieldChanged(table, uid, field, formEl);
49 };
50
51 $searchField.autocomplete({
52 // ajax options
53 serviceUrl: url,
54 params: params,
55 type: 'POST',
56 paramName: 'value',
57 dataType: 'json',
58 minChars: minimumCharacters,
59 groupBy: 'typeLabel',
60 containerClass: 'autocomplete-results',
61 appendTo: $containerElement,
62 forceFixPosition: false,
63 preserveInput: true,
64 showNoSuggestionNotice: true,
65 noSuggestionNotice: '<div class="autocomplete-info">No results</div>',
66 minLength: minimumCharacters,
67 // put the AJAX results in the right format
68 transformResult: function(response) {
69 return {
70 suggestions: $.map(response, function(dataItem) {
71 return { value: dataItem.text, data: dataItem };
72 })
73 };
74 },
75 // Rendering of each item
76 formatResult: function(suggestion, value) {
77 return $('<div>').append(
78 $('<a class="autocomplete-suggestion-link" href="#">' +
79 suggestion.data.sprite + suggestion.data.text +
80 '</a></div>').attr({
81 'data-label': suggestion.data.label,
82 'data-table': suggestion.data.table,
83 'data-uid': suggestion.data.uid
84 })).html();
85 },
86 onSearchComplete: function() {
87 $containerElement.addClass('open');
88 },
89 beforeRender: function(container) {
90 // Unset height, width and z-index again, should be fixed by the plugin at a later point
91 container.attr('style', '');
92 $containerElement.addClass('open');
93 },
94 onHide: function() {
95 $containerElement.removeClass('open');
96 },
97 onSelect: function() {
98 insertValue($containerElement.find('.autocomplete-selected a')[0]);
99 }
100 });
101
102 // set up the events
103 $containerElement.on('click', '.autocomplete-suggestion-link', function(evt) {
104 evt.preventDefault();
105 });
106 };
107
108 /**
109 * Return a function that gets DOM elements that are checked if suggest is already initialized
110 * @exports TYPO3/CMS/Backend/FormEngineSuggest
111 */
112 return function(selectorElements) {
113 $(selectorElements).each(function(key, el) {
114 if (!$(el).data('t3-suggest-initialized')) {
115 initialize($(el));
116 $(el).data('t3-suggest-initialized', true);
117 }
118 });
119 };
120 });