I'm doing validations on a register page with regular expressions, but the problem is that when I hit the "Register" button the flow continues, if or if I have to put an if and else, but for that I have to get an value of javascript and this has to be past visual basic.net.
Register button
Protected Sub btnRegistrar_Click(sender As Object, e As EventArgs) Handles btnRegistrar.Click
Dim clRegistrar As New SIMULADOR_LOG.clsExamenLOG
Dim User As New SIMULADOR_ENT.clsUsuarioSim
With User
.dni_user = txtDNI.Text
.ape_pat_user = txtApellidoPaterno.Text
.ape_mat_user = txtApellidoMaterno.Text
.nombre_user = txtNombres.Text
.direccion_user = txtDireccion.Text
.celular_user = txtCelular.Text
.correo_user = txtCorreo.Text
.dept_user = cmbDepartamento.Text
.prov_user = cmbProvincia.Text
.dist_user = cmbDistrito.Text
.fech_nacimiento = txtFechaNacimiento.Text
End With
Dim mensajeLog As String = clRegistrar.RegistrarUsuario(User)
Dim Mensaje As String = "<script type=""text/javascript"">" &
"Message('El sistema dice: " & mensajeLog & "')</script>"
ClientScript.RegisterStartupScript(Me.GetType, "msg", Mensaje)
Response.Redirect("SimuladorExamen.aspx")
End Sub
In the code of my "Register" button I could put in an if the txtDNI is empty, etc. But that would not be the only validation, I have more, then I show them.
Javascript validations using jquery (registrar.js)
$(document).ready(function () {
$("#form1").submit(function () {
//===========================DNI==================================
if ($("#txtDNI").val().trim().length == 0) {
alert("Te falta el campo 'DNI'");
return false;
}
var reg = /^[0-9]+$/;
if (!(reg.test($("#txtDNI").val().trim()))) {
alert("Ingrese solo números en el campo 'DNI'");
return false;
}
if ($("#txtDNI").val().trim().length != 8) {
alert("Su DNI debe ser 8 números");
return false;
}
//===========================APELLIDO PATERNO==================================
if ($("#txtApellidoPaterno").val().trim().length == 0) {
alert("Te falta el campo 'Apellido Paterno'");
return false;
}
var reg = /^[ÁÉÍÓÚA-Z|a-záéíóú][a-záéíóú|ÁÉÍÓÚA-Z]+(\s+[ÁÉÍÓÚA-Z|a-záéíóú]?[a-záéíóú|ÁÉÍÓÚA-Z]+)*$/;
if (!(reg.test($("#txtApellidoPaterno").val().trim()))) {
alert("Ingrese solo letras en el campo 'Apellido Paterno'");
return false;
}
if (!($("#txtApellidoPaterno").val().trim().length <= 60)) {
alert("Su Apellido paterno debe ser menos de 60 caractéres");
return false;
}
if (!($("#txtApellidoPaterno").val().trim().length >= 3)) {
alert("Su Apellido paterno debe ser más de 3 caractéres");
return false;
}
//===========================APELLIDO MATERNO==================================
if ($("#txtApellidoMaterno").val().trim().length == 0) {
alert("Te falta el campo 'Apellido Materno'");
return false;
}
//var reg = /^[ÁÉÍÓÚA-Z][a-záéíóú]+(\s+[ÁÉÍÓÚA-Z]?[a-záéíóú]+)*$/;
var reg = /^[ÁÉÍÓÚA-Z|a-záéíóú][a-záéíóú|ÁÉÍÓÚA-Z]+(\s+[ÁÉÍÓÚA-Z|a-záéíóú]?[a-záéíóú|ÁÉÍÓÚA-Z]+)*$/;
if (!(reg.test($("#txtApellidoMaterno").val().trim()))) {
alert("Ingrese solo letras en el campo 'Apellido Materno'");
return false;
}
if (!($("#txtApellidoMaterno").val().trim().length <= 60)) {
alert("Su Apellido Materno debe ser menos de 60 caractéres");
return false;
}
if (!($("#txtApellidoMaterno").val().trim().length >= 3)) {
alert("Su Apellido Materno debe ser más de 3 caractéres");
return false;
}
//===========================NOMBRE COMPLETO==================================
if ($("#txtNombres").val().trim().length == 0) {
alert("Te falta el campo 'Nombres'");
return false;
}
var reg = /^[ÁÉÍÓÚA-Z|a-záéíóú][a-záéíóú|ÁÉÍÓÚA-Z]+(\s+[ÁÉÍÓÚA-Z|a-záéíóú]?[a-záéíóú|ÁÉÍÓÚA-Z]+)*$/;
if (!(reg.test($("#txtNombres").val().trim()))) {
alert("Ingrese solo letras en el campo 'Nombres'");
return false;
}
if (!($("#txtNombres").val().trim().length <= 60)) {
alert("Su Nombre debe ser menos de 60 caractéres");
return false;
}
if (!($("#txtNombres").val().trim().length >= 2)) {
alert("Su Nombre debe ser más de 2 caractéres");
return false;
}
//===========================DIRECCION COMPLETA==================================
if ($("#txtDireccion").val().trim().length == 0) {
alert("Te falta el campo 'Dirección'");
return false;
}
if (!($("#txtDireccion").val().trim().length <= 200)) {
alert("Su Dirección debe ser menos de 200 caractéres");
return false;
}
if (!($("#txtDireccion").val().trim().length >= 10)) {
alert("Su Dirección debe ser más de 10 caractéres");
return false;
}
//===========================NUMERO DE CELULAR==================================
if ($("#txtCelular").val().trim().length == 0) {
alert("Te falta el campo 'Celular'");
return false;
}
var reg = /^[0-9]+$/;
if (!(reg.test($("#txtCelular").val().trim()))) {
alert("Ingrese solo números en el campo 'Celular'");
return false;
}
if ($("#txtCelular").val().trim().length != 9) {
alert("Su celular debe ser 9 números");
return false;
}
//===========================CORREO ELECTRONICO==================================
if ($("#txtCorreo").val().trim().length == 0) {
alert("Te falta el campo 'Correo'");
return false;
}
var reg = /^[a-zA-Z0-9\._-]+@(hotmail|gmail)[.][a-zA-Z]{2,4}$/;
if (!(reg.test($("#txtCorreo").val().trim()))) {
alert("Ingrese un correo válido en el campo 'Correo Electrónico'");
return false;
}
if (!($("#txtCorreo").val().trim().length <= 60)) {
alert("Su Correo debe ser menos de 60 caractéres");
return false;
}
if (!($("#txtCorreo").val().trim().length >= 11)) {
alert("Su Correo debe ser más de 11 caractéres");
return false;
}
//===========================DEPARTAMENTO==================================
if ($("#cmbDepartamento").val() == 0) {
alert("Te falta escoger el 'Departamento'");
return false;
}
////===========================PROVINCIA==================================
if ($("#cmbProvincia").val() == 0) {
alert("Te falta escoger el 'Provincia'");
return false;
}
//===========================DISTRITO==================================
if ($("#cmbDistrito").val() == 0) {
alert("Te falta escoger el 'Distrito'");
return false;
}
return false;
});
});
I know I'm doing bad practices, but I'm just doing tests:)
I will also show you my HTML code
Register.aspx
<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="Registrar.aspx.vb" Inherits="waSimExamen.Registrar" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Registrar</title>
<link rel="stylesheet" href="../Content/bootstrap.css" />
<link rel="stylesheet" href="../css/css_registrar.css" />
<link href="../jscript/themes/blitzer/jquery.ui.all.css" rel="stylesheet" />
<script type="text/javascript" src="../jscript/jquery-1.9.1.js"></script>
<script src="../jscript/ui/jquery.ui.core.js"></script>
<script src="../jscript/ui/jquery.ui.widget.js"></script>
<script src="../jscript/ui/jquery.ui.mouse.js"></script>
<script src="../jscript/ui/jquery.ui.draggable.js"></script>
<script src="../jscript/ui/jquery.ui.position.js"></script>
<script src="../jscript/ui/jquery.ui.resizable.js"></script>
<script src="../jscript/ui/jquery.ui.button.js"></script>
<script src="../jscript/ui/jquery.ui.dialog.js"></script>
<script src="jscript/registrar.js"></script>
<%--<link href="../css/demos.css" rel="stylesheet" />--%>
<style type="text/css">
.auto-style1 {
width: 200px;
height: 49px;
}
</style>
<script type="text/javascript">
function Message(msg) {
$("#msg").html(msg);
$("#dialog-message").dialog({
modal: true,
buttons: {
Aceptar: function () {
$(this).dialog("close");
}
}
});
}
</script>
</head>
<body>
<header>
<img src="Imagenes/logo.png"/>
</header>
<form id="form1" runat="server" class="form-horizontal" enctype="multipart/form-data">
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" >
<ContentTemplate>
<!-- MESSAGE BOX -->
<div id="dialog-message" title="Registrar">
<p id="msg"></p>
</div>
<!-- Fin del Message Box -->
<div id="caja_registrar">
<h1>Formulario de Registro</h1>
<label>DNI:</label><br />
<asp:TextBox type="text" autofocus="autofocus" runat="server" ID="txtDNI" AutoPostBack="True"/><br />
<asp:Label runat="server" Visible="false">Fecha de nacimiento:</asp:Label><%--<br />--%>
<asp:TextBox type="text" runat="server" ID="txtFechaNacimiento" Visible="false"/><%--<br />--%>
<label>Apellido Paterno:</label><br />
<asp:TextBox type="text" runat="server" Enabled="false" ID="txtApellidoPaterno"/><br />
<label>Apellido Materno:</label><br />
<asp:TextBox type="text" runat="server" Enabled="false" ID="txtApellidoMaterno"/><br />
<label>Nombres:</label><br />
<asp:TextBox type="text" runat="server" Enabled="false" ID="txtNombres"/><br />
<label>Dirección:</label><br />
<asp:TextBox type="text" runat="server" ID="txtDireccion"/><br />
<label>Departamento:</label><br />
<asp:DropDownList runat="server" ID="cmbDepartamento" AutoPostBack="True"/><br />
<label>Provincia:</label><br />
<asp:DropDownList runat="server" ID="cmbProvincia" AutoPostBack="True"/><br />
<label>Distrito:</label><br />
<asp:DropDownList runat="server" ID="cmbDistrito" AutoPostBack="True"/><br />
<label>Número de celular:</label><br />
<asp:TextBox type="text" runat="server" ID="txtCelular"/><br />
<label>Correo electrónico:</label><br />
<asp:TextBox type="text" runat="server" ID="txtCorreo"/><br />
<asp:Button ID="btnRegistrar" Text="Registrarme" runat="server"/>
</div>
</ContentTemplate>
</asp:UpdatePanel>
</form>
<footer>
<div>Desarrollado por el Departamento de Informática - SENCICO 2018</div>
</footer>
</body>
</html>