-
Collegare 2 codici
Ho questi 2 codici, ma per praticità ho bisogno di farli diventare uno
Codice PHP:
function contaNomeG() {
var val = document.forms.mioformG;
max = 20;
if (val.nome.value.length > max) {
val.nome.value = val.nome.value.substring(0,max);
document.getElementById('contaNomeG').innerHTML = "• Nome: max 20 caratteri";
}
else {
document.getElementById('contaNomeG').innerHTML = "";
}
}
...
function nomeCampoG() {
var f = document.forms.mioformG;
//.value == "" rende il campo obbligatorio, anche lo spazio bianco iniziale fa uscire l'alert
if(f.nome.value == "") {
f.nome.style.borderColor='black'
f.nome.style.backgroundColor='#d8ecff'
document.getElementById('nomeCampoG').innerHTML = "• Inserire il Nome";
f.nome.focus();
return false;
}
else {
document.getElementById('nomeCampoG').innerHTML = "";
}
return true;
-
Se vuoi accorpare le due funzioni , basta incorparare la prima nella seconda..
la prima funzione controlla il numero massimo di caratteri inseriti
la seconda che il camo non sia vuoto (quindi obbligatorio)
nella seconda funzione nel il controllo IF VALUE dopo ELSE (quindi si è inserito qualcosa nel campo) copia il codice della prima funzione
...
non capisco alcuni comportamenti nelle azioni scritte..
nella seconda funzione se il campo è vuoto lo evidenzi graficamente , inserisci il testo "Inserire il Nome" e lo selezioni
se invece il campo contiene del testo tu elimini il suo contenuto.
.. questo perchè usai la stessa funzione per inizializzare il campo e controllarne il contenuto ?
in ogni caso ...
Codice PHP:
function nomeCampoG() {
var f = document.forms.mioformG;
if(f.nome.value == "") {
f.nome.style.borderColor='black'
f.nome.style.backgroundColor='#d8ecff'
document.getElementById('nomeCampoG').innerHTML = "• Inserire il Nome";
f.nome.focus();
return false;
}else{
var max = 20;
if (f.nome.value.length > max) {
f.nome.value = f.nome.value.substring(0,max);
document.getElementById('contaNomeG').innerHTML = "• Nome: max 20 caratteri";
}else{
document.getElementById('contaNomeG').innerHTML = "";
document.getElementById('nomeCampoG').innerHTML = "";
}
}
return true;
}
-
L'ho provata, non esce l'alert se inserisco più di 20 caratteri
Codice PHP:
function nomeCampoG() {
var f = document.forms.mioformG;
if(f.nome.value == "") {
f.nome.style.borderColor='black'
f.nome.style.backgroundColor='#d8ecff'
document.getElementById('nomeCampoG').innerHTML = "• Inserire il Nome";
f.nome.focus();
return false;
}else{
var max = 20;
if (f.nome.value.length > max) {
f.nome.value = f.nome.value.substring(0,max);
document.getElementById('contaNomeG').innerHTML = "• Nome: max 20 caratteri";
}else{
document.getElementById('contaNomeG').innerHTML = "";
document.getElementById('nomeCampoG').innerHTML = "";
}
}
return true;
}
-
Ho riscritto il codice (semplificandolo un po'..)
Codice PHP:
<script>
function nomeCampoG() {
var f = document.getElementById("mioformG");
var fn = document.getElementById("formNome");
var fd = document.getElementById('contaNomeG');
if(fn.value == "" || fn.value == "Inserire il Nome") {
fn.style.borderColor='black';
fn.style.backgroundColor='#d8ecff';
fn.value = "Inserire il Nome";
fn.focus();
}else{
var max = 20;
if (fn.value.length > max) {
fn.value.substring(0,max);
fd.innerHTML = "Nome: max 20 caratteri";
}else{
fn.value = "";
fd.innerHTML = "";
f.submit();
}
}
}
</script>
Codice HTML:
<body onload="nomeCampoG()">
<form id="mioformG">
<input id="formNome" type="text" name="nome" value="" />
<div id="contaNomeG"></div>
<div style="box-shadow:0px 0px 5px;width:100px;text-align:center;margin:20px;cursor:pointer;" onclick="nomeCampoG()">Prosegui</div>
</form>
</body>
ma volendo puoi semplificare ancora di più .. e non serve JS..
Codice HTML:
<body>
<form id="mioformG">
<input id="formNome" type="text" name="nome" value="" maxlength="20" required />
<button onclick="nomeCampoG()">Prosegui</button>
</form>
</body>
