asp.net-mvc - 当依赖属性更改值时，删除/添加 requiredif 的星号

Question

我有以下场景:多个必需的 DataAnnotation 属性。我制作了一个自定义标签助手，它在需要装饰的属性旁边呈现一个“*”。现在，在客户端，如果依赖属性更改值，我希望能够隐藏/显示。

为了更精确的例子，我有一个模型

public class Document {
public bool IsFake {get; set; }

[RequiredIf("IsFake",false,ValueComparison.IsEqual)]
public string Number{ get; set; }
}

根据我制作的标签助手，我在 UI 中拥有带有红色 * 的 Number 相应标签。当我在客户端从 is fake 更改为 is not fake 单选按钮时，我想隐藏 *。

我希望能够自动进行此更改，而不是为已知字段创建一个脚本来执行此操作，因为我有多个这样的情况。

我在想也许我可以编写一段 JavaScript 代码，将更改事件动态附加到依赖属性输入和一个显示/隐藏所需标记的处理程序。

Answer 1

这几乎是我想出的解决方案。这是我能做的最好的事情，但仍然需要一些定制，这意味着包含“*”的跨度是为我的页面 DOM 定制的。

            <div class="editor-label">
                <label ui-documentLabel" for="Number">Number<span class="span-required">*</span></label>
            </div>
            <div class="editor-field">
                <input class="k-textbox ui-textbox" data-val="true" data-val-requiredif="The field Number is required!" data-val-requiredif-dependentproperty="IsFake" data-val-requiredif-dependentvalue="False" data-val-requiredif-operator="IsEqual" id="Number" name="Number" value="" type="text">
                <span class="field-validation-valid" data-valmsg-for="Number" data-valmsg-replace="true"></span>
            </div>

和 JavaScript

  var clietsidevalidation = function () { };

 clietsidevalidation.is = function (value1, operator, value2) {
//function that verifies that the comparison between value1 and value2 is true or not
};

 clietsidevalidation.handleRequirefIf = function (container) {



$('input', container).filter(function () {
    var attr = $(this).attr('data-val-requiredif');
    return (typeof attr !== 'undefined' && attr !== false);
}).each(function (index, item) {

    var params = new Array();
    params["operator"] = $(this).attr('data-val-requiredif-operator');
    params["dependentvalue"] = $(this).attr('data-val-requiredif-dependentvalue');
    params["dependentproperty"] = $(this).attr('data-val-requiredif-dependentproperty');

    var dependentProperty = clietsidevalidation.getName(this, params["dependentproperty"]);
    var dependentTestValue = params["dependentvalue"];
    var operator = params["operator"];
    var dependentPropertyElement = document.getElementsByName(dependentProperty);
    params["element"] = this;


    $(dependentPropertyElement).on('change', { params: params }, function (e) {
        var input = e.data.params.element;
        var inputName = $(input).attr("name");
        var $span = $('label[for=' + inputName + '] span', '.editor-label');

        var dependentProperty = this;
        var dependentTestValue = e.data.params["dependentvalue"];
        var operator = e.data.params["operator"];
        var dependentPropertyElement = $(this);

        var dependentValue = null;

        if (dependentPropertyElement.length > 1) {
            for (var index = 0; index != dependentPropertyElement.length; index++)
                if (dependentPropertyElement[index]["checked"]) {
                    dependentValue = dependentPropertyElement[index].value;
                    break;
                }

            if (dependentValue == null)
                dependentValue = false
        }
        else
            dependentValue = dependentPropertyElement[0].value;

        if (clietsidevalidation.is(dependentValue, operator, dependentTestValue) == false) {

            $span.addClass('hidden');

            var $form = $span.closest("form");
            // get validator object
            var $validator = $form.validate();

            var $errors = $form.find("span.field-validation-error[data-valmsg-for='" + inputName + "']");
            // trick unobtrusive to think the elements were succesfully validated
            // this removes the validation messages
            //custom form our solution as the validation messages are differently configured DOM
            $errors.each(function () { $validator.settings.success($('label',this)); })

            // clear errors from validation
            $validator.resetForm();
        }
        else {
            $span.removeClass('hidden')
        }
    });

});
 };

这是受到另一篇文章的启发，我现在找不到，但当我找到时，我会发布一个链接。