ATLAS-1897 : UI - Render HTML element based on attribute data-type while assigning Tag to entity.
diff --git a/dashboardv2/public/js/views/tag/addTagModalView.js b/dashboardv2/public/js/views/tag/addTagModalView.js
index 7eaf23c..97d80bd 100644
--- a/dashboardv2/public/js/views/tag/addTagModalView.js
+++ b/dashboardv2/public/js/views/tag/addTagModalView.js
@@ -26,6 +26,7 @@
'utils/UrlLinks',
'utils/Enums',
'utils/Messages',
+ 'daterangepicker'
], function(require, AddTagModalViewTmpl, VTagList, VCommonList, Modal, VEntity, Utils, UrlLinks, Enums, Messages) {
'use strict';
@@ -82,7 +83,12 @@
};
tagAttributeNames.each(function(i, item) {
var selection = $(item).data("key");
- tagAttributes[selection] = $(item).val() || null;
+ var datatypeSelection = $(item).data("type");
+ if (datatypeSelection === "date") {
+ tagAttributes[selection] = Date.parse($(item).val()) || null;
+ } else {
+ tagAttributes[selection] = $(item).val() || null;
+ }
});
if (that.multiple) {
@@ -271,16 +277,44 @@
_.each(enumValue, function(key, value) {
str += '<option ' + (that.tagModel && key.value === that.tagModel.attributes[name] ? 'selected' : '') + '>' + key.value + '</option>';
})
- that.ui.tagAttribute.append('<div class="form-group"><label>' + name + '</label>' +
+ that.ui.tagAttribute.append('<div class="form-group"><label>' + name + '</label>' + ' (' + typeName + ')' +
'<select class="form-control attributeInputVal attrName" data-key="' + name + '">' + str + '</select></div>');
} else {
- that.ui.tagAttribute.append('<div class="form-group"><label>' + name + '</label>' +
- '<input type="text" value="' + (that.tagModel ? (that.tagModel.attributes[name] == null ? '' : that.tagModel.attributes[name]) : '') + '" class="form-control attributeInputVal attrName" data-key="' + name + '" ></input></div>');
+ var textElement = that.getElement(name, typeName);
+ that.ui.tagAttribute.append('<div class="form-group"><label>' + name + '</label>' + ' (' + typeName + ')' + textElement);
+ }
+ });
+ that.$('input[data-type="date"]').each(function() {
+ if (!$(this).data('daterangepicker')) {
+ var dateObj = { "singleDatePicker": true, "showDropdowns": true };
+ if (that.tagModel) {
+ var formatDate = Number(this.value);
+ dateObj["startDate"] = new Date(formatDate);
+ }
+ $(this).daterangepicker(dateObj);
+ }
+ });
+ that.$('select[data-type="boolean"]').each(function() {
+ var labelName = $(this).data('key');
+ if (that.tagModel) {
+ this.value = that.tagModel.attributes[labelName];
}
});
this.showAttributeBox();
}
},
+ getElement: function(labelName, typeName) {
+ var value = this.tagModel && this.tagModel.attributes ? (this.tagModel.attributes[labelName] || "") : "",
+ type = (typeName === "int" || typeName === "long" || typeName === "float" || typeName === "byte" || typeName === "double" || typeName === "short") ? "number" : "text";
+ if (typeName === "boolean") {
+ return '<select class="form-control attributeInputVal attrName" data-key="' + labelName + '" data-type="' + typeName + '"> ' +
+ '<option value="">--Select true or false--</option>' +
+ '<option value="true">true</option>' +
+ '<option value="false">false</option></select>';
+ } else {
+ return '<input type="' + type + '" value="' + value + '" class="form-control attributeInputVal attrName" data-key="' + labelName + '" data-type="' + typeName + '"></input></div>';
+ }
+ },
saveTagData: function(options) {
var that = this;
this.entityModel = new VEntity();