Show validation message below each ASP.Net TextBox using jQuery

Hi Ramco,

You need to create a separate row and put your error message inside the created row so that your error message will display below TextBox.

Please refer below sample.

HTML

<style type="text/css">
    .display-next { clear: both; display: block; float: left; }
</style>

<div class="row">
    <div class="col-12">
        <div class="input-group mb-4">
            <span class="input-group-text"><i class="fas fa-user-tie"></i></span>
            <asp:TextBox ID="txtVName" class="form-control alph" minlength="3" runat="server" placeholder="Enter your Name"></asp:TextBox>
        </div>
    </div>
</div>
<div class="row container">
    <h5 id="txtVNameMsg" class="display-next"></h5>
</div>

<div class="row">
    <div class="col-12">
        <div class="input-group mb-4">
            <span class="input-group-text"><i class="fas fa-user-tie"></i></span>
            <asp:TextBox ID="TextBox1" class="form-control alph" minlength="3" runat="server" placeholder="Enter your Name"></asp:TextBox>
        </div>
    </div>
</div>
<div class="row container">
    <h5 id="txtVNameMsg1" class="display-next"></h5>
</div>
<div class="row">
    <div class="col-12">
        <div class="input-group mb-4">
            <span class="input-group-text"><i class="fas fa-at"></i></span>
            <asp:TextBox ID="txtVEmail" class="form-control" runat="server" AutoComplete="off" placeholder="Enter your Email"></asp:TextBox>
            <br />
            <h5 id="txtVEmailMsg" style="color: red; text-align: left; width: 200px"></h5>
        </div>
    </div>
</div>
<asp:LinkButton ID="lnkBookDemo" runat="server" Style="color: red;" OnClientClick="return DoValidation3()">Book Demo Slot</asp:LinkButton>

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
    function DoValidation3(parameter) {
        var valid = true;
        var txtVName = document.getElementById("txtVName").value;
        var txtVEmail = document.getElementById("txtVEmail").value;

        if ($.trim(txtVName) < 3) {
            $('#txtVNameMsg, #txtVNameMsg1').show();
            $('#txtVNameMsg, #txtVNameMsg1').text('Name is Required. Minimum 3 characters.');
            return false;
        }
        else if (txtVEmail.length < 6) {
            $('#txtVEmailMsg').show();
            $('#txtVEmailMsg').text('Email is Required. Minimum 6 characters.');
            return false;
        }
        return valid;
    };
</script>

Screenshot