[FIX] web: allow to change the row on textarea in TextField with a prop
Before this commit, the rows attribute given on the TextField component was always 2, it is not possible to alter it without overriding the component. This commit adds a props to be able to update the rows with a prop called `rowCount` and this prop can be set via `rows` attribute set on the field. task-2947516 X-original-commit: 110915c80c2a2578563283b1744e0e88d80ac4bb
This commit is contained in:
@@ -6,6 +6,7 @@ import { useInputField } from "../input_field_hook";
|
||||
import { standardFieldProps } from "../standard_field_props";
|
||||
import { TranslationButton } from "../translation_button";
|
||||
import { useDynamicPlaceholder } from "../dynamicplaceholder_hook";
|
||||
import { parseInteger } from '../parsers';
|
||||
|
||||
const { Component, useEffect, onMounted, onWillUnmount, useRef } = owl;
|
||||
|
||||
@@ -67,7 +68,7 @@ export class TextField extends Component {
|
||||
return 50;
|
||||
}
|
||||
get rowCount() {
|
||||
return 2;
|
||||
return this.props.rowCount;
|
||||
}
|
||||
|
||||
resize() {
|
||||
@@ -105,23 +106,31 @@ TextField.template = "web.TextField";
|
||||
TextField.components = {
|
||||
TranslationButton,
|
||||
};
|
||||
TextField.defaultProps = {dynamicPlaceholder: false};
|
||||
TextField.defaultProps = {
|
||||
dynamicPlaceholder: false,
|
||||
rowCount: 2,
|
||||
};
|
||||
TextField.props = {
|
||||
...standardFieldProps,
|
||||
isTranslatable: { type: Boolean, optional: true },
|
||||
placeholder: { type: String, optional: true },
|
||||
dynamicPlaceholder: { type: Boolean, optional: true},
|
||||
rowCount: { type: Number, optional: true },
|
||||
};
|
||||
|
||||
TextField.displayName = _lt("Multiline Text");
|
||||
TextField.supportedTypes = ["html", "text"];
|
||||
|
||||
TextField.extractProps = ({ attrs, field }) => {
|
||||
return {
|
||||
const props = {
|
||||
isTranslatable: field.translate,
|
||||
placeholder: attrs.placeholder,
|
||||
dynamicPlaceholder: attrs.options.dynamic_placeholder,
|
||||
};
|
||||
if (attrs.rows) {
|
||||
props.rowCount = parseInteger(attrs.rows);
|
||||
}
|
||||
return props;
|
||||
};
|
||||
|
||||
registry.category("fields").add("text", TextField);
|
||||
@@ -131,8 +140,12 @@ export class ListTextField extends TextField {
|
||||
return 0;
|
||||
}
|
||||
get rowCount() {
|
||||
return 1;
|
||||
return this.props.rowCount;
|
||||
}
|
||||
}
|
||||
ListTextField.defaultProps = {
|
||||
...TextField.defaultProps,
|
||||
rowCount: 1,
|
||||
};
|
||||
|
||||
registry.category("fields").add("list.text", ListTextField);
|
||||
|
||||
@@ -240,6 +240,28 @@ QUnit.module("Fields", (hooks) => {
|
||||
);
|
||||
});
|
||||
|
||||
QUnit.test("set row on text fields", async function (assert) {
|
||||
serverData.models.partner.fields.foo.type = "text";
|
||||
|
||||
await makeView({
|
||||
type: "form",
|
||||
resModel: "partner",
|
||||
resId: 1,
|
||||
serverData,
|
||||
arch: `
|
||||
<form>
|
||||
<field name="foo" rows="4"/>
|
||||
</form>`,
|
||||
});
|
||||
|
||||
const textarea = target.querySelector("textarea");
|
||||
assert.strictEqual(
|
||||
textarea.rows,
|
||||
4,
|
||||
"rowCount should be the one set on the field",
|
||||
);
|
||||
});
|
||||
|
||||
QUnit.test(
|
||||
"autoresize of text fields is done when switching to edit mode",
|
||||
async function (assert) {
|
||||
|
||||
Reference in New Issue
Block a user