Livecycle javascript...压缩 if 语句答案

【问题标题】：Livecycle javascript...condense if statementLivecycle javascript...压缩 if 语句
【发布时间】：2015-01-08 14:22:02
【问题描述】：

我正在制作一个带有“验证”按钮的表单。此按钮的目的是检查并确保所有字段都已完成（这是项目要求的）。下面是检查字段是否为null 然后更改边框颜色并显示文本框的代码。

if (form1.Main.sfRequestor.requestNameFirst.rawValue == null){
    form1.Main.sfRequest.txtValidate.presence = "visible";
    form1.Main.sfRequestor.requestNameFirst.border.edge.color.value = "255,0,0"
} else {
    form1.Main.sfRequest.txtValidate.presence = "hidden";
    form1.Main.sfRequestor.requestNameFirst.border.edge.color.value = "255,255,255"
};

if (form1.Main.sfRequestor.requestNameLast.rawValue == null){
    form1.Main.sfRequest.txtValidate.presence = "visible";
    form1.Main.sfRequestor.requestNameLast.border.edge.color.value = "255,0,0"
} else {
    form1.Main.sfRequest.txtValidate.presence = "hidden";
    form1.Main.sfRequestor.requestNameLast.border.edge.color.value = "255,255,255"
};

在几个子表单中有 20 多个字段需要检查。我正在尝试整合代码，但不知道如何去做。变量可以处理 Javascript 中的字段名称吗？

【问题讨论】：

form1、Main、sfRequestor等变量是什么？
用括号表示你可以做 requestNameFirst["rawValue"]
你有哪些元素？它们都是文本框吗？
主要是文本框，但日期、下拉列表、表格和单选按钮。

标签： javascript if-statement livecycle

【解决方案1】：

你可以很容易地把它变成一个循环，并且可以把它写成一个IIFE来保持你的命名空间干净

(function (arr) {
    var txtValidate = form1.Main.sfRequest.txtValidate,
        i, e;
    for (i = 0; i < arr.length; ++i) {
        e = form1.Main.sfRequestor[arr[i]]; // cache me
        if (e.rawValue == null){
            txtValidate.presence = "visible";
            e.border.edge.color.value = "255,0,0"
        } else {
            txtValidate.presence = "hidden";
            e.border.edge.color.value = "255,255,255"
        }
    }
}(['requestNameFirst', 'requestNameLast']));

但是，txtValidate.presence 似乎只设置为最后一项的条件，您确定不想使用标志并将其设置为最后一项吗？例如

(function (arr) {
    var txtValidateState = 'hidden',
        i, e;
    for (i = 0; i < arr.length; ++i) {
        e = form1.Main.sfRequestor[arr[i]];
        if (e.rawValue == null){
            txtValidateState = "visible"; // any null makes txtValidate visible
            e.border.edge.color.value = "255,0,0"
        } else {
            e.border.edge.color.value = "255,255,255"
        }
    }
    form1.Main.sfRequest.txtValidate.presence = txtValidateState; // set last
}(['requestNameFirst', 'requestNameLast']));

通用表单的更新，假设 sfRequestor 和 sfRequest

(function (form, arr) {
    var txtValidateState = 'hidden',
        i, e;
    for (i = 0; i < arr.length; ++i) {
        e = form.sfRequestor[arr[i]];
        if (e.rawValue == null){
            txtValidateState = "visible";
            e.border.edge.color.value = "255,0,0";
        } else {
            e.border.edge.color.value = "255,255,255";
        }
    }
    form.sfRequest.txtValidate.presence = txtValidateState;
}(form1.Main, ['requestNameFirst', 'requestNameLast']));

更新假设 sfRequest 是一个常量，但 sfRequestor 可能不同

(function () { // moved IIFE to protect namespace
    function validate(form, subform, arr) { // now named, new param subform
        var txtValidateState = 'hidden',
            i, e;
        for (i = 0; i < arr.length; ++i) {
            e = form[subform][arr[i]]; // select from subform
            if (e.rawValue == null){
                txtValidateState = "visible";
                e.border.edge.color.value = "255,0,0";
            } else {
                e.border.edge.color.value = "255,255,255";
            }
        }
        form.sfRequest.txtValidate.presence = txtValidateState; // assuming stays same
    }
    validate(form1.Main, 'sfRequestor', ['requestNameFirst', 'requestNameLast']);
    validate(form1.Main, 'sfClientInfo', ['firstname']);
    // if you have many here you can re-write as a loop again
}());

【讨论】：

哇，谢谢！唯一我看不到的工作是有多个子表单。
也许你可以用一个简单的额外参数/参数来引用你想要的形式:)
@silviak 请查看编辑并让我知道您的表单是否不能以这种方式引用----如果您想多次运行此功能（对于不同的表单），您可能想要给它现在也有了名字
我尝试运行更新的（第三个）代码块。我在不同的子表单中添加了另一个字段，但它不适用于该字段。我是 javascript 新手，我正在尝试阅读您的代码以理解它，但我找不到子表单的列出位置
@silviak 它被写成一次做一个 form，最后一行采用 form，然后是 sfRequestor 中的项目名称.如果你想做几个forms，把它从一个IIFE改成一个命名的function，然后为每个form。如果这没有进一步帮助，请举一个不同形式的示例，以便我了解需要如何修改代码。

【解决方案2】：

你可以很容易地把它变成一个简单的函数：

 function validateField(element) {
     if (element.rawValue == null) {
        form1.Main.sfRequest.txtValidate.presence = "visible";
        element.border.edge.color.calue = "255,0,0";
     }
     else {
        form1.Main.sfRequest.txtValidate.presence = "hidden";
        element.border.edge.color.calue = "255,255,255";      
     }
 }

然后就这样称呼它：

validateField(form1.Main.sfRequestor.requestNameFirst);
validateField(form1.Main.sfRequestor.requestNameLast);

为了进一步简化，将所有 20 个元素放在一个数组中并循环

var elements = [form1.Main.sfRequestor.requestNameFirst, form1.Main.sfRequestor.requestNameLast, ...];
elements.forEach(function(element) {
    validateField(element);
});

【讨论】：