Formulario Html5 elemento "necesario" en el iPad/iPhone no funciona
-
11-12-2019 - |
Pregunta
iPad safari se supone para ser compatible con html5, pero parece que el elemento necesario no funciona.Alguien sabe por qué, o una buena solución que no requiere de una tonelada de JavaScript?
Mi código
<input type=email class=input placeholder="Email" name="email" required>
Solución
No es compatible con iOS todavía: cuando puedo usar: requerido .
Otros consejos
Esta es una solución jQuery para el problema, resalta los campos de entrada que también han fallado en un color meñique.
$('form').submit(function(){
var required = $('[required="true"]'); // change to [required] if not using true option as part of the attribute as it is not really needed.
var error = false;
for(var i = 0; i <= (required.length - 1);i++)
{
if(required[i].value == '') // tests that each required value does not equal blank, you could put in more stringent checks here if you wish.
{
required[i].style.backgroundColor = 'rgb(255,155,155)';
error = true; // if any inputs fail validation then the error variable will be set to true;
}
}
if(error) // if error is true;
{
return false; // stop the form from being submitted.
}
});
Dado que iOS 10.3 estos atributos son compatibles.También el tipo de correo electrónico requiere escribir el símbolo @ y así sucesivamente ...
Si ya está usando JQery, ModernIZR, y Yepnope, esta es una forma de lidiar con ella.Si no lo eres, esto agregará un montón de JavaScript adicional.
Supongo que se puede hacer algo antes de presentar la acción como esta
<form name="myForm" action="valid.html" onsubmit="checkValid()" method="post">
... ...
</form>
después de pulsar submit
botón, checkValid()
es evocado antes de que realmente se presenta.un valor de retorno de true
continuará la acción de enviar.
consulte este post para una explicación más detallada.:)
Si usa PHP, puede agregar una validación como esta
function validation(){
if(isset($_POST['submit'])){
$email = $_POST['email'];
if(empty($email)){
echo $error = "Your email cannot be empty";
} else {
return true; //or do something next here
}
}
A continuación, agregue esta función en PHP antes de su formulario.