填写表单

填充表单中的空单元格。

用户可以从列表中选择用户名，表单编辑器中的所有字段都将填充用户联系信息。同时，这些数据显示在自定义界面的输入框中。

当用户在自定义界面中编辑输入数据时，它也会在表单编辑器中自动更新。

文档准备好后，可以通过单击提交按钮来提交表单数据。

它是如何运作的

当用户打开表单文档时，将执行 GetAllContentControls 方法以从文档中收集所有内容控件。之后，执行 GetFormValue 方法来获取内容控件的值，并将其显示在自定义界面中：

var contentControls = [];

var onDocumentReady = function () {
    window.connector = docEditor.createConnector();

    connector.executeMethod("GetAllContentControls", null, function (data) {
            ]setTimeout(function () {
                for (let i = 0; i< data.length; i++) {

                ...

                connector.executeMethod("GetFormValue", [data[i]["InternalId"]], function (value) {
                    data[i].Value = value ? value : "";
                    if (data.length - 1 == i) {
                        contentControls = data;

                        ...
                    }
                });
            }
        }, 0);
    });
};

当用户从列表中选择用户名时，将执行 GetFormsByTag 方法，通过其标签收集所有表单，并使用 SetFormValue 方法为其设置相应的值：

$("#persons").change(function (e) {
    const postalCode = $(this).val();

    $.getJSON("/zh/app_data/editor/wildcarddata/persons.json", function (persons) {
        for (const person of persons) {
            if (person["PostalCode"] == postalCode) {
                for (key in person) {
                    var value = person[key];

                    ...

                    setFormValue(key, value);
                }
            }
        }
    })

    var setFormValue = function (tag, value) {
        connector.executeMethod(
            "GetFormsByTag",
            [tag],
            function (forms) {
                connector.executeMethod(
                    "SetFormValue",
                    [forms[0]["InternalId"], value],
                    null
                );
            }
        );
    }
});

当用户编辑表单值时，会触发 onChangeContentControl 事件，然后执行 GetFormValue 方法以获取更新的表单值并将其显示在自定义界面中：

var onDocumentReady = function () {

    ...

    connector.attachEvent("onChangeContentControl", onChangeContentControl);

    ...

};

function onChangeContentControl(e) {
    connector.executeMethod("GetFormValue", [e["InternalId"]], function (value) {

        ...

        $("#" + e["InternalId"]).val(value || "");

        ...
    });
}

请注意，该连接器仅适用于 ONLYOFFICE 开发者版本。

此类是一项附加功能，需要额外付费。如果您有任何疑问，请通过 sales@onlyoffice.com 联系我们的销售团队。