custom fields: Add UI for choice type custom fields.

This commit is contained in:
Yashashvi Dave 2018-05-04 20:16:46 +05:30 committed by Tim Abbott
parent 512ab5dbaf
commit 06e63af4b4
3 changed files with 32 additions and 7 deletions

View File

@ -610,8 +610,8 @@ function render(template_name, args) {
var field = {name: "GitHub user name", id: 2, hint: "Or link to profile"};
var args = {field: field, field_value: "@GitHub", field_type: "text"};
var html = render('custom-user-profile-field', args);
assert.equal($(html).find('input').attr('id'), 2);
assert.equal($(html).find('input').val(), "@GitHub");
assert.equal($(html).attr('id'), 2);
assert.equal($(html).find('.custom_user_field_value').val(), "@GitHub");
assert.equal($(html).find('.field_hint').text(), "Or link to profile");
assert.equal($(html).find('label').text(), "GitHub user name");
}());

View File

@ -61,11 +61,23 @@ exports.add_custom_profile_fields_to_settings = function () {
var type;
var value = people.my_custom_profile_data(field.id);
var is_long_text = field_type === "Long Text";
var is_choice_field = field_type === "Choice";
var field_choices = [];
if (field_type === "Long Text" || field_type === "Short Text") {
type = "text";
} else if (field_type === "Choice") {
type = "choice";
var field_choice_dict = JSON.parse(field.field_data);
for (var choice in field_choice_dict) {
if (choice) {
field_choices[field_choice_dict[choice].order] = {
value: choice,
text: field_choice_dict[choice].text,
selected: choice === value,
};
}
}
} else if (field_type === "Date") {
type = "date";
} else if (field_type === "URL") {
@ -82,6 +94,8 @@ exports.add_custom_profile_fields_to_settings = function () {
field_type: type,
field_value: value,
is_long_text_field: is_long_text,
is_choice_field: is_choice_field,
field_choices: field_choices,
});
$("#account-settings .custom-profile-fields-form").append(html);
});
@ -313,12 +327,12 @@ exports.set_up = function () {
$("#deactivate_self_modal").modal("show");
});
$(".custom_user_field input, .custom_user_field textarea").on('change', function () {
$(".custom_user_field_value").on('change', function () {
var fields = [];
var value = $(this).val();
fields.push({id: parseInt($(this).parent().attr("id"), 10), value: value});
var spinner = $("#custom-field-status").expectOne();
loading.make_indicator(spinner, {text: 'Saving ...'});
fields.push({id: parseInt($(this).attr("id"), 10), value: value});
settings_ui.do_settings_change(channel.patch, "/json/users/me/profile_data",
{data: JSON.stringify(fields)}, spinner);
});

View File

@ -1,9 +1,20 @@
<div class="user-name-section custom_user_field">
<div class="user-name-section custom_user_field" name="{{ field.name }}" id="{{ field.id }}">
<label for="{{ field.name }}" class="title">{{ field.name }}</label>
{{#if is_long_text_field}}
<textarea name="{{ field.name }}" id="{{ field.id }}" maxlength="500">{{ field_value }}</textarea>
<textarea maxlength="500" class="custom_user_field_value">{{ field_value }}</textarea>
{{else}}
<input type="{{ field_type }}" name="{{ field.name }}" id="{{ field.id }}" value="{{ field_value }}" maxlength="50" />
{{#if is_choice_field }}
<select class="custom_user_field_value">
{{#unless field_value}}
<option></option>
{{/unless}}
{{#each field_choices}}
<option value="{{ this.value }}" {{#if this.selected}}selected{{/if}}>{{ this.text }}</option>
{{/each}}
</select>
{{else}}
<input class="custom_user_field_value" type="{{ field_type }}" value="{{ field_value }}" maxlength="50" />
{{/if}}
{{/if}}
<div class="field_hint">{{ field.hint }}</div>
</div>