Display validation errors using Page_ClientValidate. When a control causes a validation error, besides display an error message, we can add a red border around the control to catch user’s attention.

    <div>
        <asp:TextBox ID="TextBoxName" maxlength="100" runat="server" />
        <asp:RequiredFieldValidator runat="server" controltovalidate="TextBoxName" SetFocusOnError="true"></asp:RequiredFieldValidator>
    </div>    
    <div>
        <asp:TextBox ID="TextBoxEmail" maxlength="100" runat="server" />
        <asp:RequiredFieldValidator runat="server" controltovalidate="TextBoxEmail" SetFocusOnError="true"></asp:RequiredFieldValidator>
        <asp:RegularExpressionValidator runat="server" ControlToValidate="TextBoxEmail" ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*"></asp:RegularExpressionValidator>
    </div>

<asp:LinkButton ID="ButtonSubmit" runat="server" Text="Submit" OnClientClick="webPartInputs()" onClick="ButtonSubmit_Click" /> 

<script type="text/javascript">
    function validateControls() {
        if (Page_ClientValidate()) {
            return true;
        }
        else {
            var ids = [];
            $.each(Page_Validators, function () {
                var validator = $(this)[0];
                if (validator != null) {
                    var controltovalidate = validator.controltovalidate;
                    if (controltovalidate != null) {
                        ValidatorValidate(validator);

                        if (ids[controltovalidate] == null || ids[controltovalidate] == true) {
                            ids[controltovalidate] = validator.isvalid;
                        }
                    }
                }
            });
            for (var key in ids) {
                if (ids[key] == true) {
                    $('#' + key).removeClass('error');
                }
                else {
                    $('#' + key).addClass('error');
                }
            }
            return false;
        }
    }
</script>