Apply label updating logic all relevant input labels

This commit is contained in:
Carson Sievert
2019-05-01 13:33:06 -05:00
parent a5a0f23c3a
commit 09388c9f07
14 changed files with 140 additions and 76 deletions

View File

@@ -27,6 +27,8 @@ $.extend(checkboxInputBinding, {
if (data.hasOwnProperty('value'))
el.checked = data.value;
// checkboxInput()'s label works different from other
// input labels...the label container should always exist
if (data.hasOwnProperty('label'))
$(el).parent().find('span').text(data.label);

View File

@@ -59,8 +59,10 @@ $.extend(checkboxGroupInputBinding, {
if (data.hasOwnProperty('value'))
this.setValue(el, data.value);
if (data.hasOwnProperty('label'))
$el.find('label[for="' + $escape(el.id) + '"]').text(data.label);
var escape_id = $escape(el.id);
var labelNode = $(el).find('label[for="' + escape_id + '"]');
var labelHTML = "<label for='" + escape_id + "'></label>";
updateLabel(data.label, labelNode, labelHTML, $el.find(".shiny-options-group"));
$(el).trigger('change');
},

View File

@@ -60,8 +60,11 @@ $.extend(dateInputBinding, {
receiveMessage: function(el, data) {
var $input = $(el).find('input');
if (data.hasOwnProperty('label'))
$(el).find('label[for="' + $escape(el.id) + '"]').text(data.label);
var escape_id = $escape(el.id);
var labelNode = $(el).find('label[for="' + escape_id + '"]');
var labelTemplate = "<label for='" + escape_id + "'></label>";
updateLabel(data.label, labelNode, labelTemplate, $input);
if (data.hasOwnProperty('min'))
this._setMin($input[0], data.min);

View File

@@ -80,8 +80,10 @@ $.extend(dateRangeInputBinding, dateInputBinding, {
var $startinput = $inputs.eq(0);
var $endinput = $inputs.eq(1);
if (data.hasOwnProperty('label'))
$el.find('label[for="' + $escape(el.id) + '"]').text(data.label);
var escape_id = $escape(el.id);
var labelNode = $el.find('label[for="' + escape_id + '"]');
var labelHTML = "<label for='" + escape_id + "'></label>";
updateLabel(data.label, labelNode, labelHTML, el);
if (data.hasOwnProperty('min')) {
this._setMin($startinput[0], data.min);

View File

@@ -24,8 +24,11 @@ $.extend(numberInputBinding, textInputBinding, {
if (data.hasOwnProperty('max')) el.max = data.max;
if (data.hasOwnProperty('step')) el.step = data.step;
if (data.hasOwnProperty('label'))
$(el).parent().find('label[for="' + $escape(el.id) + '"]').text(data.label);
var escape_id = $escape(el.id);
var labelNode = $(el).parent().find('label[for="' + escape_id + '"]');
var labelHTML = "<label for='" + escape_id + "'></label>";
updateLabel(data.label, labelNode, labelHTML, el);
$(el).trigger('change');
},

View File

@@ -41,8 +41,10 @@ $.extend(radioInputBinding, {
if (data.hasOwnProperty('value'))
this.setValue(el, data.value);
if (data.hasOwnProperty('label'))
$(el).parent().find('label[for="' + $escape(el.id) + '"]').text(data.label);
var escape_id = $escape(el.id);
var labelNode = $(el).parent().find('label[for="' + $escape(el.id) + '"]');
var labelHTML = "<label for='" + escape_id + "'></label>";
updateLabel(data.label, labelNode, labelHTML, el);
$(el).trigger('change');
},

View File

@@ -123,15 +123,14 @@ $.extend(selectInputBinding, {
this.setValue(el, data.value);
}
if (data.hasOwnProperty('label')) {
let escaped_id = $escape(el.id);
if (this._is_selectize(el)) {
escaped_id += "-selectized";
}
$(el).parent().parent()
.find('label[for="' + escaped_id + '"]')
.text(data.label);
let escaped_id = $escape(el.id);
if (this._is_selectize(el)) {
escaped_id += "-selectized";
}
var labelNode = $(el).parent().parent()
.find('label[for="' + escaped_id + '"]');
var labelHTML = "<label for='" + escaped_id + "'></label>";
updateLabel(data.label, labelNode, labelHTML, el);
$(el).trigger('change');
},

View File

@@ -130,8 +130,10 @@ $.extend(sliderInputBinding, textInputBinding, {
}
}
if (data.hasOwnProperty('label'))
$el.parent().find('label[for="' + $escape(el.id) + '"]').text(data.label);
var escape_id = $escape(el.id);
var labelNode = $(el).parent().find('label[for="' + escape_id + '"]');
var labelHTML = "<label for='" + escape_id + "'></label>";
updateLabel(data.label, labelNode, labelHTML, el);
var domElements = ['data-type', 'time-format', 'timezone'];
for (var i = 0; i < domElements.length; i++) {

View File

@@ -27,27 +27,10 @@ $.extend(textInputBinding, {
if (data.hasOwnProperty('value'))
this.setValue(el, data.value);
var labelTag = $(el).parent().find('label[for="' + $escape(el.id) + '"]');
var hasLabelTag = labelTag.length > 0;
// If data.label exists, then we may need to insert a label
// tag into the DOM. If it doesn't exist, then the label tag
// should be removed to be more consistent with the behavior
// of `textInput(label = NULL)`
if (data.hasOwnProperty('label')) {
if (hasLabelTag) {
labelTag.text(data.label);
} else {
$('<label for="' + $escape(el.id) + '"></label>').text(data.label).insertBefore(el);
}
} else {
if (hasLabelTag) labelTag.remove();
}
var escape_id = $escape(el.id);
var labelNode = $(el).parent().find('label[for="' + escape_id + '"]');
var labelTemplate = "<label for='" + escape_id + "'></label>";
updateLabel(data.label, labelNode, labelTemplate, el);
if (data.hasOwnProperty('placeholder'))
el.placeholder = data.placeholder;

View File

@@ -326,3 +326,35 @@ exports.compareVersion = function(a, op, b) {
else if (op === "<") return (diff < 0);
else throw `Unknown operator: ${op}`;
};
function updateLabel(labelTxt, labelNode, labelHTML, insertBeforeEl) {
// Only update if label was specified in the update method
if (typeof labelTxt === "undefined") return;
// Should the label node exist?
var labelEmpty = $.isArray(labelTxt) && labelTxt.length === 0;
// Does the label node already exist?
var labelNode = labelNode || [];
var labelNodeExists = labelNode.length > 0;
if (labelNodeExists) {
if (labelEmpty) {
labelNode.remove();
} else {
labelNode.text(labelTxt);
}
} else {
if (!labelEmpty) {
// Some labels are actually spans
var newLabelNode = $(labelHTML).text(labelTxt);
newLabelNode.insertBefore(insertBeforeEl);
}
}
}