Show/Hide 下拉列表基于 OTRS 中的另一个选项

Show/Hide dropdown based on another option in OTRS

我正在尝试创建一个 .js(类似于 Core.Agent.Znuny4OTRSShowPendingTimeIfNeeded.js),其主要功能是 show/enable 在 Next State 下拉列表中选择特定选项时的特定 dynamicField 下拉列表。目前,所有这些只影响 ATPending 操作。 这是我目前的尝试:

$(document).ready(function() {
            setTimeout(function() {
                    const Action = Core.Config.Get("Action");
                    const SupportedActions = ["AgentTicketPending"];

                    if ($.inArray(Action, SupportedActions) !== -1) {
                        if (Action === "AgentTicketPending")
                        document.getElementsByClassName("Row Row_DynamicField_ApproverList")[0].style.visibility = "hidden";
                        $('#NewStateID').on('change', function() {
                                const Option = $(this).val();
                                if (Option === 'pending approval') {
                                    document.getElementsByClassName("Row Row_DynamicField_ApproverList")[0].style.visibility = "visible";
                                } else if (Option !== 'pending approval') {
                                    document.getElementsByClassName("Row Row_DynamicField_ApproverList")[0].style.visibility = "hidden";
                                }
                            }
                        );
                    }
                });
            });

简历:选择“未决批准”状态时,可见DF“批准者”。

这个例子使用了OTRS/ZnunyJS文件的典型结构。这样你就不需要 $(document).ready 或超时。我想您还创建了自己的 xml 文件来全局加载此 JS。 如果你想支持更多语言,你应该使用状态的 ID,我在这里使用了 StateID 4 (open)。希望对您有所帮助。

"use strict";

var Core = Core || {};
Core.Agent = Core.Agent || {};

/**
 * @namespace Core.Agent.HideField
 * @memberof Core.Agent
 * @description
 *      This namespace contains the functions for handling Agent.HideField.
 */
Core.Agent.HideField = (function (TargetNS) {

    /**
     * @name Init
     * @memberof Core.Agent.HideField
     * @function
     * @description
     *      Initializes the module functionality.
     */
    TargetNS.Init = function () {

        const SupportedActions = ["AgentTicketPending"];
        const Action = Core.Config.Get("Action");

        if ($.inArray( Action, SupportedActions) !== -1) {

            $('#NewStateID').on('change', function() {
                if (Action === "AgentTicketPending") {
                    // use:
                    // $("#NewStateID").children("option").filter(":selected").text()
                    // to get the text of the selected option

                    if ( $('#NewStateID').val() == "4" ) {
                        // hide dynamic field
                        $('.Row.Row_DynamicField_ApproverList').hide();
                    }else{
                        // show dynamic field
                        $('.Row.Row_DynamicField_ApproverList').show();
                    }
                }
            });
        }

    };

    Core.Init.RegisterNamespace(TargetNS, 'APP_MODULE');

    return TargetNS;
}(Core.Agent.HideField || {}));