Merge branch 'wip-MDL-51966-master' of https://github.com/marinaglancy/moodle

This commit is contained in:
Andrew Nicols
2015-10-30 07:31:28 +08:00
3 changed files with 71 additions and 15 deletions
File diff suppressed because one or more lines are too long
+61 -12
View File
@@ -259,8 +259,9 @@ define(['jquery', 'core/log', 'core/str', 'core/templates', 'core/notification']
* @param {JQuery} originalSelect The JQuery object matching the hidden select list.
* @param {Boolean} multiple Are multiple items allowed to be selected?
* @param {Boolean} tags Are we allowed to create new items on the fly?
* @param {Boolean} caseSensitive - If search has to be made case sensitive.
*/
var updateSuggestions = function(query, inputId, suggestionsId, originalSelect, multiple, tags) {
var updateSuggestions = function(query, inputId, suggestionsId, originalSelect, multiple, tags, caseSensitive) {
// Find the elements in the DOM.
var inputElement = $(document.getElementById(inputId));
var suggestionsElement = $(document.getElementById(suggestionsId));
@@ -276,6 +277,7 @@ define(['jquery', 'core/log', 'core/str', 'core/templates', 'core/notification']
});
// Re-render the list of suggestions.
var searchquery = caseSensitive ? query : query.toLocaleLowerCase();
templates.render(
'core/form_autocomplete_suggestions',
{ inputId: inputId, suggestionsId: suggestionsId, options: options, multiple: multiple}
@@ -289,7 +291,8 @@ define(['jquery', 'core/log', 'core/str', 'core/templates', 'core/notification']
// For each option in the list, hide it if it doesn't match the query.
suggestionsElement.children().each(function(index, node) {
node = $(node);
if (node.text().indexOf(query) > -1) {
if ((caseSensitive && node.text().indexOf(searchquery) > -1) ||
(!caseSensitive && node.text().toLocaleLowerCase().indexOf(searchquery) > -1)) {
node.show().attr('aria-hidden', false);
matchingElements = true;
} else {
@@ -469,8 +472,9 @@ define(['jquery', 'core/log', 'core/str', 'core/templates', 'core/notification']
* @param {Boolean} multiple Are multiple items allowed to be selected?
* @param {Boolean} tags Are we allowed to create new items on the fly?
* @param {Object} ajaxHandler This is a module that does the ajax fetch and translates the results.
* @param {Boolean} caseSensitive - If search has to be made case sensitive.
*/
var updateAjax = function(e, selector, inputId, suggestionsId, originalSelect, multiple, tags, ajaxHandler) {
var updateAjax = function(e, selector, inputId, suggestionsId, originalSelect, multiple, tags, ajaxHandler, caseSensitive) {
// Get the query to pass to the ajax function.
var query = $(e.currentTarget).val();
// Call the transport function to do the ajax (name taken from Select2).
@@ -498,7 +502,7 @@ define(['jquery', 'core/log', 'core/str', 'core/templates', 'core/notification']
}
});
// Update the list of suggestions now from the new values in the select list.
updateSuggestions('', inputId, suggestionsId, originalSelect, multiple, tags);
updateSuggestions('', inputId, suggestionsId, originalSelect, multiple, tags, caseSensitive);
}, notification.exception);
};
@@ -517,8 +521,18 @@ define(['jquery', 'core/log', 'core/str', 'core/templates', 'core/notification']
* @param {String} selector The selector for this select list.
* @param {String} ajax Name of an AMD module to handle ajax requests. If specified, the AMD
* module must expose 2 functions "transport" and "processResults".
* @param {Boolean} caseSensitive - If search has to be made case sensitive.
*/
var addNavigation = function(inputId, suggestionsId, downArrowId, selectionId, originalSelect, multiple, tags, selector, ajax) {
var addNavigation = function(inputId,
suggestionsId,
downArrowId,
selectionId,
originalSelect,
multiple,
tags,
selector,
ajax,
caseSensitive) {
// Start with the input element.
var inputElement = $(document.getElementById(inputId));
// Add keyboard nav with keydown.
@@ -532,11 +546,25 @@ define(['jquery', 'core/log', 'core/str', 'core/templates', 'core/notification']
// Handle ajax population of suggestions.
if (!inputElement.val() && ajax) {
require([ajax], function(ajaxHandler) {
updateAjax(e, selector, inputId, suggestionsId, originalSelect, multiple, tags, ajaxHandler);
updateAjax(e,
selector,
inputId,
suggestionsId,
originalSelect,
multiple,
tags,
ajaxHandler,
caseSensitive);
});
} else {
// Else - open the suggestions list.
updateSuggestions(inputElement.val(), inputId, suggestionsId, originalSelect, multiple, tags);
updateSuggestions(inputElement.val(),
inputId,
suggestionsId,
originalSelect,
multiple,
tags,
caseSensitive);
}
}
// We handled this event, so prevent it.
@@ -610,7 +638,7 @@ define(['jquery', 'core/log', 'core/str', 'core/templates', 'core/notification']
window.clearTimeout(closeSuggestionsTimer);
}
// Show the suggestions list.
updateSuggestions(inputElement.val(), inputId, suggestionsId, originalSelect, multiple, tags);
updateSuggestions(inputElement.val(), inputId, suggestionsId, originalSelect, multiple, tags, caseSensitive);
});
var suggestionsElement = $(document.getElementById(suggestionsId));
@@ -665,7 +693,7 @@ define(['jquery', 'core/log', 'core/str', 'core/templates', 'core/notification']
// Whenever the input field changes, update the suggestion list.
inputElement.on('input', function(e) {
var query = $(e.currentTarget).val();
updateSuggestions(query, inputId, suggestionsId, originalSelect, multiple, tags);
updateSuggestions(query, inputId, suggestionsId, originalSelect, multiple, tags, caseSensitive);
});
};
@@ -681,8 +709,9 @@ define(['jquery', 'core/log', 'core/str', 'core/templates', 'core/notification']
* module must expose 2 functions "transport" and "processResults".
* These are modeled on Select2 see: https://select2.github.io/options.html#ajax
* @param {String} placeholder - The text to display before a selection is made.
* @param {Boolean} caseSensitive - If search has to be made case sensitive.
*/
enhance: function(selector, tags, ajax, placeholder) {
enhance: function(selector, tags, ajax, placeholder, caseSensitive) {
// Set some default values.
if (typeof tags === "undefined") {
tags = false;
@@ -690,6 +719,9 @@ define(['jquery', 'core/log', 'core/str', 'core/templates', 'core/notification']
if (typeof ajax === "undefined") {
ajax = false;
}
if (typeof caseSensitive === "undefined") {
caseSensitive = false;
}
// Look for the select element.
var originalSelect = $(selector);
@@ -743,7 +775,16 @@ define(['jquery', 'core/log', 'core/str', 'core/templates', 'core/notification']
// Update the form label to point to the text input.
originalLabel.attr('for', inputId);
// Add the event handlers.
addNavigation(inputId, suggestionsId, downArrowId, selectionId, originalSelect, multiple, tags, selector, ajax);
addNavigation(inputId,
suggestionsId,
downArrowId,
selectionId,
originalSelect,
multiple,
tags,
selector,
ajax,
caseSensitive);
var inputElement = $(document.getElementById(inputId));
var suggestionsElement = $(document.getElementById(suggestionsId));
@@ -754,7 +795,15 @@ define(['jquery', 'core/log', 'core/str', 'core/templates', 'core/notification']
if (ajax) {
require([ajax], function(ajaxHandler) {
var handler = function(e) {
updateAjax(e, selector, inputId, suggestionsId, originalSelect, multiple, tags, ajaxHandler);
updateAjax(e,
selector,
inputId,
suggestionsId,
originalSelect,
multiple,
tags,
ajaxHandler,
caseSensitive);
};
// Trigger an ajax update after the text field value changes.
inputElement.on("input keypress", handler);
+9 -2
View File
@@ -46,6 +46,8 @@ class MoodleQuickForm_autocomplete extends MoodleQuickForm_select {
protected $ajax = '';
/** @var string $placeholder Placeholder text for an empty list. */
protected $placeholder = '';
/** @var bool $casesensitive Wether the search has to be case-sensitive. */
protected $casesensitive = false;
/**
* constructor
@@ -54,7 +56,7 @@ class MoodleQuickForm_autocomplete extends MoodleQuickForm_select {
* @param mixed $elementLabel Label(s) for the select
* @param mixed $options Data to be used to populate options
* @param mixed $attributes Either a typical HTML attribute string or an associative array. Special options
* "tags", "placeholder", "ajax", "multiple" are supported.
* "tags", "placeholder", "ajax", "multiple", "casesensitive" are supported.
*/
function MoodleQuickForm_autocomplete($elementName=null, $elementLabel=null, $options=null, $attributes=null) {
// Even if the constructor gets called twice we do not really want 2x options (crazy forms!).
@@ -75,6 +77,10 @@ class MoodleQuickForm_autocomplete extends MoodleQuickForm_select {
$this->ajax = $attributes['ajax'];
unset($attributes['ajax']);
}
if (isset($attributes['casesensitive'])) {
$this->casesensitive = $attributes['casesensitive'] ? true : false;
unset($attributes['casesensitive']);
}
parent::HTML_QuickForm_select($elementName, $elementLabel, $options, $attributes);
$this->_type = 'autocomplete';
@@ -91,7 +97,8 @@ class MoodleQuickForm_autocomplete extends MoodleQuickForm_select {
// Enhance the select with javascript.
$this->_generateId();
$id = $this->getAttribute('id');
$PAGE->requires->js_call_amd('core/form-autocomplete', 'enhance', $params = array('#' . $id, $this->tags, $this->ajax, $this->placeholder));
$PAGE->requires->js_call_amd('core/form-autocomplete', 'enhance', $params = array('#' . $id, $this->tags, $this->ajax,
$this->placeholder, $this->casesensitive));
return parent::toHTML();
}