/ / ¿Cómo validar la entrada de un formulario HTML sin usar JavaScript? - html, validación

¿Cómo validar la entrada de formulario HTML sin usar JavaScript? - html, validación

Tengo un formulario como el siguiente:

<form action="/html/tags/html_form_tag_action.cfm" method="get">
<table>
<tr>
<td>Name:</td>
<td>
<input type="text" name="name_applicant" value="" maxlength="100" />
</td>
</tr>
<tr>
<tr><td>Date Of Birth:</td></tr>
<tr>
<td>Date:</td><td>
<select>
<option value ="1">1</option>
<option value ="2">2</option>
<option value ="3">3</option>
<option value ="4">4</option>
<option value ="5">5</option>
<option value ="6">6</option>
<option value ="7">7</option>
<option value ="8">8</option>
<option value ="9">9</option>
<option value ="10">10</option>
<option value ="11">11</option>
<option value ="12">12</option>
<option value ="13">13</option>
<option value ="14">14</option>
<option value ="15">15</option>
<option value ="16">16</option>
<option value ="17">17</option>
<option value ="18">18</option>
<option value ="19">19</option>
<option value ="20">20</option>
<option value ="21">21</option>
<option value ="22">22</option>
<option value ="23">23</option>
<option value ="24">24</option>
<option value ="25">25</option>
<option value ="26">26</option>
<option value ="27">27</option>
<option value ="28">28</option>
<option value ="29">29</option>
<option value ="30">30</option>
<option value ="31">31</option>
</select>
</td>
<td>Month:</td>
<td>
<select>
<option value ="Jan">Jan</option>
<option value ="Feb">Feb</option>
<option value ="Mar">Mar</option>
<option value ="Apr">Apr</option>
<option value ="May">May</option>
<option value ="Jun">Jun</option>
<option value ="Jul">Jul</option>
<option value ="Aug">Aug</option>
<option value ="Sep">Sep</option>
<option value ="Oct">Oct</option>
<option value ="Nov">Nov</option>
<option value ="Dec">Dec</option>
</select>
</td>
<td>Year:</td>
<td>
<input type="text" name="first_name" value="" maxlength="4" />
</td>
</tr>
<tr>
<td>EmailID:</td>
<td>
<input type="text" name="first_name" value="" maxlength="25" />
</td><td>@gmail.com</td>
</tr>
<tr><td> </td>
<td>
<input type="submit" value="Submit" />
</td>
</tr>
</table>
</form>

De esta forma quiero asegurarme de que, en el cuadro de texto, solo se acepte texto como entrada; y solo se aceptan números en el cuadro de números. ¿Cómo lo hago sin usar JavaScript?

Respuestas

7 para la respuesta № 1

Javascript es la única forma de validar los datosen el lado del cliente antes de enviarlo. Dado que Javascript se puede deshabilitar, su código del lado del servidor siempre debe validar cualquier dato enviado antes de usarlo.


6 para la respuesta № 2

Como todos dijeron, nunca confíe en la verificación del lado del cliente y HTML 5 puede manejar su problema, aquí hay un ejemplo:

<style>
body {
font-family: arial;
font-size: 15px;
}

br {
clear: left;
}

label {
float: left;
width: 120px;
}

label, span {
font-weight: bold;
margin-bottom: 20px;
}

span {
color: red;
display: inline-block;
}
</style>

<form action = "/html/tags/html_form_tag_action.cfm" method = "get">
<!-- Regular expression took care of the "maxlength" attribute -->

<label>Name: </label>
<input autofocus = "autofocus" name = "name_applicant" pattern = "^D{0,100}$" required = "required" type = "text" /> * <br />

<label>Date of birth: </label>
<input name = "name_applicant" required = "required" type = "date" /> <br />

<label>Email Id: </label>
<input name = "first_name" pattern = "^D{0,15}@gmail.com$" placeholder = "anything@gmail.com" required = "required" type = "email" /> *<br />

<span>* Do not use numbers</span> <br />

<input type = "submit" value = "Submit" />
</form>

Vista previa (la mayoría de las personas no tienen Opera ni Safari)

1 2 3 4e


2 para la respuesta № 3

Lo más probable es que no pueda hacer esto solo con HTML. La excepción es el uso de HTML5, que puede que no pueda utilizar.

HTML5 tiene un pattern atributo que puede proporcionar una expresión regular para restringir lo que se puede escribir. Sin embargo, no todos los navegadores admiten elementos y atributos HTML5 y es posible que no sea 100% para usted. Más información: http://www.whatwg.org/specs/web-apps/current-work/multipage/common-input-element-attributes.html#attr-input-pattern

Puede usar JavaScript para evitar que suceda y tampoco es infalible, ya que JavaScript se puede desactivar en el navegador.

Su mejor apuesta sería utilizar un servidorlenguaje de secuencias de comandos (es decir, PHP, ASP) para verificar que los datos enviados se validan a lo que espera y, si no, evitar que se envíen y arrojar un error. Esta es una práctica común y, a veces, se usa en combinación con restricciones de JavaScript.


1 para la respuesta № 4

puedes probar complemento jquery valijate. por supuesto, es un complemento de jquery. pero utiliza atributos "data-XXXX" para realizar las validaciones. puede realizar la mayor parte de la validación sin escribir códigos javascript.

aquí hay un ejemplo para lograr el requisito anterior

<form class="valijate">
<input type="text" data-valijate="at_text_change" data-vjerr="text must not contain any letter or character" data-vjmustn="?l, ?c">
</form>

clase valijate y data-vjmustn = "? l,? c" haz la magia. se comprobará con cada pulsación de tecla (data-valijate = "at_text_change")

si el usuario ingresó datos no válidos, el usuario no podrá enviar el formulario.


0 para la respuesta № 5

Vea este ejemplo de código:

<form>
<input type="text"
name="Number(s) Only"
pattern="[;0-9]+"
title ="Must be format: 12345;67891; etc"
placeholder="12345; 67891; etc."
onfocusout="this.checkValidity() ? "" : alert("Must be format: 12345;67891; etc")"
required>
</form>`

Esto validará el cuadro cuando haga clic fuera de él.