Hi
I want error message to appear below textbox. Currently it is appearing on Right Side of textbox
<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> <h5 id="txtVNameMsg" class="display-next" style="color: red;text-align:left;width:200px"></h5> </div> </div> </div>
<div class="row"> </div> <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" Type="Email" placeholder="Enter your Email"></asp:TextBox> <h5 id="txtVEmailMsg" style="color: red;text-align:left;width:200px"></h5> </div> </div>
<asp:LinkButton ID="lnkBookDemo" runat="server" Style="color: white;" OnClientClick="return DoValidation3()" >Book Demo Slot</asp:LinkButton>
<script> function DoValidation3(parameter) { var valid = true; var txtVName = document.getElementById("txtVName").value; var txtVEmail = document.getElementById("txtVEmail").value;
if ($.trim(txtVName) < 3) { $('#txtVNameMsg').show(); $('#txtVNameMsg').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; };
Thanks