表单验证：如何让age_from显示红边框但错误信息在age_to的help-block中？

Absolutely, you can totally pull this off! The core idea is to mark the invalid field (age_from) as having an error state so the frontend can apply the red border, while routing all error messages to the specified age_to help-block. Here's how to handle it depending on your stack:

If you're using a server-side framework like Yii (matches your code snippet) #

First, adjust your validation method to explicitly mark age_from as invalid while attaching the error message to age_to:

public function dateFunc()
{
    $isValid = true;

    if ($this->age_from < 1) {
        // Mark age_from as invalid (empty message means no inline error for it)
        $this->addError('age_from', '');
        // Push the actual error message to age_to's error container
        $this->addError('age_to', 'error message1');
        $isValid = false;
    }

    if ($this->age_to < 1) {
        $this->addError('age_to', 'error message2');
        $isValid = false;
    }

    return $isValid;
}

Then in your view, disable inline errors for age_from so its own error block doesn't show up, while keeping age_to's error block intact:

// age_from will get the red border (thanks to the error state) but no inline error text
<?= $form->field($model, 'age_from')->textInput()->error(false) ?>

// age_to's help-block will display all collected error messages
<?= $form->field($model, 'age_to')->textInput() ?>

Most server-side form builders (like Yii's ActiveForm) automatically add error classes (e.g., has-error for Bootstrap) to fields marked as invalid in the model, so the red border will appear without extra work.

If you're handling validation purely client-side (e.g., jQuery Validate) #

You can customize error placement and field highlighting directly in your JS:

$("#your-form-id").validate({
    rules: {
        age_from: { min: 1 },
        age_to: { min: 1 }
    },
    messages: {
        age_from: "error message1",
        age_to: "error message2"
    },
    // Route age_from's error to age_to's help-block
    errorPlacement: function(error, element) {
        if (element.attr("name") === "age_from") {
            error.appendTo($("#age_to-error")); // Target age_to's error container
        } else {
            error.insertAfter(element);
        }
    },
    // Add red border to invalid fields
    highlight: function(element) {
        $(element).closest(".form-group").addClass("has-error");
    },
    // Remove border when field becomes valid
    unhighlight: function(element) {
        $(element).closest(".form-group").removeClass("has-error");
    }
});

Key Takeaway #

The trick is separating two things:

1. Marking which fields are invalid (so the frontend can apply visual feedback like red borders)
2. Where to display the actual error text

By explicitly marking age_from as invalid in your validation logic, you let the frontend style it correctly, while funneling all messages to the age_to help-block as needed.

内容的提问来源于stack exchange，提问作者Vadik