Javascript client-side validation does not work ASP.Net
Question
I have a webform within a Masterpage with two textboxes, and I am trying to validate the textboxes before saving some data to the Database.
If I test the Javascript code in a simple application such as a simple Login, it works. But when I use it for my app I doesn't work. It simply saves empty spaces to the database.
I have no Idea why the JS code is not working and I do not know what else to do.
This is some of my page code:
</head>
<body>
<form id="form1" class="contact-form text-right">
<section class="contact-area" id="contact">
<div class="container-fluid">
<div class="row align-items-center d-flex justify-content-start">
<div class="col-lg-6 col-md-12 contact-left no-padding">
<div>
<%-- tabla aqui --%>
<table style="width: 100%;">
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
</div>
</div>
<div class="col-lg-4 col-md-12 pt-100 pb-100">
<asp:Label runat="server" ID="lblFecha" Text=""></asp:Label>
<asp:Label runat="server" ID="lblIDUsuario" visible="false" Text=""></asp:Label>
<asp:Label runat="server" ID="lblUsuario" Text=""></asp:Label>
<asp:TextBox ID="txtID" visible="true" class="common-input mt-10" type="numeric" readonly="false" runat="server"></asp:TextBox>
<asp:TextBox ID="txtTitulo" placeholder="Ingrese el título" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Ingrese el título'" class="common-input mt-10" type="text" runat="server"></asp:TextBox>
<textarea id="txtContenido" style="resize:none;" cols="20" rows="5" placeholder="Ingrese el contenido" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Ingrese el contenido'" class="common-input mt-10" type="text" runat="server"></textarea>
<asp:Button ID="btnGuardar" OnClientClick="return performCheck();" OnClick="btnGuardar_Click" runat="server" Text="Guardar" class="primary-btn mt-20"></asp:Button>
<asp:Button ID="btnActualizar" OnClientClick="return performCheck();" onClick="btnActualizar_Click" runat="server" Text="Actualizar" class="primary-btn mt-20"></asp:Button>
<asp:Label ID="lblError" runat="server" Text="" ForeColor="Red"></asp:Label>
<div class="alert-msg">
</div>
</div>
</div>
</div>
</section>
</form>
<script type="text/javascript">
function performCheck() {
if (document.getElementById("txtTitulo").value == '') {
alert(" Debe Ingresar un título");
return false;
}
if (document.getElementById("txtContenido").value == '') {
alert("Debe Ingresar un contenido");
return false;
}
return true;
}
</script>
<script src="js/vendor/jquery-2.2.4.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"></script>
<script src="js/vendor/bootstrap.min.js"></script>
<script src="js/owl.carousel.min.js"></script>
<script src="js/jquery.ajaxchimp.min.js"></script>
<script src="js/jquery.sticky.js"></script>
<script src="js/parallax.min.js"></script>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBhOdIF3Y9382fqJYt5I_sswSrEw5eihAA"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="js/jquery.magnific-popup.min.js"></script>
<script src="js/main.js"></script>
</body>
</html>
This is my JS code:
<script type="text/javascript">
function performCheck() {
if (document.getElementById("txtTitulo").value == '') {
alert(" Debe Ingresar un título");
return false;
}
if (document.getElementById("txtContenido").value == '') {
alert("Debe Ingresar un contenido");
return false;
}
return true;
}
</script>
1 answers
solution1
0 2018-05-03 15:35:48
Don't do form validations in your button's on click handlers. Do them in your form submit handler. Forms can be submitted by the user clicking enter in an input accidentally bypassing your validations. An example can be found at https://www.w3schools.com/js/js_validation.asp
This is the perfect example of why only having client side validations is insufficient. If it is critical that the data being submitted is valid you MUST implement server side validations. Whether by accident or on purpose a user can bypass any client side validations with little effort.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.