J'ai une page jsp avec des TextBox. Maintenant, je veux les remplir avec quelques informations et cliquez sur le bouton soumettre. Mais j'ai besoin de vérifier si cette TextBox est vide ou non.Comment vérifier si une zone de texte est vide en utilisant javascript
Comment est-ce que je peux faire ceci?
Canonique sans utiliser des cadres avec prototype garniture ajoutée pour les anciens navigateurs
<html>
<head>
<script type="text/javascript">
// add trim to older IEs
if (!String.trim) {
String.prototype.trim = function() {return this.replace(/^\s+|\s+$/g, "");};
}
window.onload=function() { // onobtrusively adding the submit handler
document.getElementById("form1").onsubmit=function() { // needs an ID
var val = this.textField1.value; // 'this' is the form
if (val==null || val.trim()=="") {
alert('Please enter something');
this.textField1.focus();
return false; // cancel submission
}
return true; // allow submit
}
}
</script>
</head>
<body>
<form id="form1">
<input type="text" name="textField1" value="" /><br/>
<input type="submit" />
</form>
</body>
</html>
Voici la version en ligne, mais pas recommandé je montre ici au cas où vous avez besoin d'ajouter la validation sans pouvoir factoriser le code
function validate(theForm) { // passing the form object
var val = theForm.textField1.value;
if (val==null || val.trim()=="") {
alert('Please enter something');
theForm.textField1.focus();
return false; // cancel submission
}
return true; // allow submit
}
passer l'objet de forme en (ce)
<form onsubmit="return validate(this)">
<input type="text" name="textField1" value="" /><br/>
<input type="submit" />
</form>
@Dreamonic Je ne vois pas pourquoi vous indenteriez mon code jusqu'à présent, il ne peut pas être lu sans défilement. Je l'ai échancré comme je préfère l'indenter, pour une visibilité maximale et toujours en retrait. – mplungjan
N'a pas pu résister, pourriez-vous? :) Bien, puisque nous allons le faire maintenant, je vais juste laisser ceci ici: http://meta.stackexchange.com/questions/183169 –
Pas de problème. Peut-être qu'il va le lire - dommage qu'il me coûte 10 méta-rep – mplungjan
Utiliser JavaScript vous aidera beaucoup. Certaines explications sont données dans le code.
<script type="text/javascript">
<!--
function Blank_TextField_Validator()
{
// Check whether the value of the element
// text_name from the form named text_form is null
if (!text_form.text_name.value)
{
// If it is display and alert box
alert("Please fill in the text field.");
// Place the cursor on the field for revision
text_form.text_name.focus();
// return false to stop further processing
return (false);
}
// If text_name is not null continue processing
return (true);
}
-->
</script>
<form name="text_form" method="get" action="#"
onsubmit="return Blank_TextField_Validator()">
<input type="text" name="text_name" >
<input type="submit" value="Submit">
</form>
1) Tous les navigateurs ne comprennent pas text_form - vous devez utiliser document.text_form 2) passer le formulaire à la fonction est beaucoup plus sûr et plus simple 3) Qu'est-ce que c'est "DUDE"? Pourrait être un DUDETTE – mplungjan
En utilisant regexp: \ S correspondra à caractère non des espaces: quoi que ce soit, mais pas un espace, onglet ou une nouvelle ligne. Si votre chaîne a un seul caractère qui n'est pas un espace, une tabulation ou une nouvelle ligne, alors elle n'est pas vide. Par conséquent, il vous suffit de rechercher un caractère: \ S
JavaScript:
function checkvalue() {
var mystring = document.getElementById('myString').value;
if(!mystring.match(/\S/)) {
alert ('Empty value is not allowed');
return false;
} else {
alert("correct input");
return true;
}
}
HTML:
<form onsubmit="return checkvalue(this)">
<input name="myString" type="text" value='' id="myString">
<input type="submit" value="check value" />
</form>
+1 qui empêché de rediriger vers une autre page et solvd mon problème..cheers .. – Lucky
@dreamonic - ici vous indenté le code qui en avait besoin, mais à mon avis ne va pas assez loin. La fonction et si le contenu est aligné à gauche - pas besoin d'indenter le code sous la balise de script et de perdre 12 espaces – mplungjan
@mplungjan C'est une question d'opinion. J'aurais dû indenter la fonction JavaScript, comme la dernière modification que j'ai commise. –
Vous pouvez également vérifier en utilisant jQuery .. Il est assez facile :
<html>
<head>
<title>jQuery: Check if Textbox is empty</title>
<script type="text/javascript" src="js/jquery_1.7.1_min.js"></script>
</head>
<body>
<form name="form1" method="post" action="">
<label for="city">City:</label>
<input type="text" name="city" id="city">
</form>
<button id="check">Check</button>
<script type="text/javascript">
$('#check').click(function() {
if ($('#city').val() == '') {
alert('Empty!!!');
} else {
alert('Contains: ' + $('#city').val());
}
});
</script>
</body>
</html>
Quelle que soit la méthode choisie, elle ne vous libère pas de l'exécution de la même validation à l'arrière.
<pre><form name="myform" method="post" enctype="multipart/form-data">
<input type="text" id="name" name="name" />
<input type="submit"/>
</form></pre>
<script language="JavaScript" type="text/javascript">
var frmvalidator = new Validator("myform");
frmvalidator.EnableFocusOnError(false);
frmvalidator.EnableMsgsTogether();
frmvalidator.addValidation("name","req","Plese Enter Name");
</script>
Remarque: avant d'utiliser le code ci-dessus, vous devez ajouter le fichier gen_validatorv31.js.
@mplungjan: ces données sont mises en cache, ont un peu de patience. Il va rattraper dans environ 15 minutes. – BalusC