Automatically adjust height of multiline/long fields in edit mode

Fixes #3170
This commit is contained in:
Abe Jellinek 2023-06-16 12:16:35 -07:00
parent 885ef28a0d
commit 1a2950ae34

View file

@ -1563,7 +1563,6 @@
var t;
if (Zotero.ItemFields.isMultiline(fieldName) || Zotero.ItemFields.isLong(fieldName)) {
t = document.createElement("textarea");
t.setAttribute('rows', 8);
}
// Add auto-complete for certain fields
else if (field == 'creator' || Zotero.ItemFields.isAutocompleteField(fieldName)) {
@ -1732,6 +1731,18 @@
});
t.addEventListener('keypress', event => this.handleKeyPress(event));
if (t instanceof HTMLTextAreaElement) {
let updateHeight = () => {
// Reset height before getting scrollHeight
// Prevents field from growing slightly each time
// https://stackoverflow.com/a/58073583
t.style.height = 'auto';
t.style.height = `calc(max(6em, ${t.scrollHeight}px))`;
};
t.addEventListener('input', updateHeight);
updateHeight();
}
return t;
}