可以在一個字段上以語義UI形式的驗證規則在另一個字段上為條件嗎？

Question

假設我有一個包含兩個字段的表單。 我希望以下是可能的：

提交表單為空-驗證成功兩個字段都包含數據-驗證成功字段一為數據，字段二為空-驗證成功字段一為空，字段二為數據-驗證失敗

有沒有辦法做到這一點？

我的服務器代碼已經對此進行了驗證，但是我很樂意能夠阻止客戶端在不需要的情況下訪問服務器..但是，如果不可能的話，有沒有辦法將表單驗證錯誤消息傳遞給頁面加載的形式？

謝謝！！

Answer 1

您可以將正則表達式用於復雜的驗證規則

首先向form.js添加一些代碼，該文件可以在以下位置訪問：

語義UI主機\\語義UI主機\\ dist \\ components \\ form.js

在此代碼之后

// is most likely an email
email: function(value){
  var
    emailRegExp = new RegExp("[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?", "i")
  ;
  return emailRegExp.test(value);
},

添加此代碼

// is most likely an my regex
regex: function(value,reg){
  var
    regexRegExp = new RegExp(reg, "i")
  ;
  return regexRegExp.test(value);
},

並在您的語義ui代碼中使用它，例如

firstname: {
    identifier: "first_name",
    optional: true,
    rules: [
        {
            type: "regex[^[a-zA-Z -]+$]",
            prompt: "First name can only consist of letters, spaces and dashes"
        }
    ]
}

例如，這是我的代碼，用於驗證僅包含10位數字或字母的復雜鱈魚

            $("form[data-id=\"2\"]").form({
                v: { identifier: 'active_code', rules: [{ type: "regex[^[a3-z8]{10}$]", prompt: 'کد فعال سازی خود را وارد کنید'}] }
            },
            {
                inline: true,
                on: 'blur',
                transition: 'swing left',
                duration: 1000,
                onSuccess: formOnSuccess
            }
            );

完整的代碼

        $("form[data-id=\"1\"]").form({
            f: { identifier: 'family', rules: [{ type: 'empty', prompt: 'فامیلی خود را وارد کنید'}] },
            e: { identifier: 'email', rules: [{ type: 'email', prompt: 'ایمیل خود را وارد کنید'}] }
        },
            {
                inline: true,
                on: 'blur',
                transition: 'swing left',
                duration: 1000,
                onSuccess: formOnSuccess
            }
        );
        $("form[data-id=\"2\"]").form({
            v: { identifier: 'active_code', rules: [{ type: "regex[^[a0-z9]{10}$]", prompt: 'کد فعال سازی خود را وارد کنید'}] }
        },
            {
                inline: true,
                on: 'blur',
                transition: 'swing left',
                duration: 1000,
                onSuccess: loadPersonal
            }
        );