Buon giorno a tutti.
Non riesco a creare un checkbox, se viene selezionata mi "compare" un campo dove l'utente può mettere una cifra. Se viene tolta la selezione il campo sparisce.
pensavo con onclick (ma non so se sia giusto e come usarlo).
Grazie
Buon giorno a tutti.
Non riesco a creare un checkbox, se viene selezionata mi "compare" un campo dove l'utente può mettere una cifra. Se viene tolta la selezione il campo sparisce.
pensavo con onclick (ma non so se sia giusto e come usarlo).
Grazie
così? Ho usato jQuery
Codice PHP:<html>
<head>
</head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<body>
<input type="checkbox" id="box" name="box" onclick="if(this.checked){$('#tNum').show();}else{$('#tNum').hide();}"/>
<input type="text" id="tNum" name="tNum" style="display: none;"/>
</body>
</html>
Grazie mille! risposta celere!
Provo subito.
Posso chiederti come funzionano
L'onclick e lo script?
Scusa l'ignoranza, perchè vedendo così credo di capire cheCodice PHP:<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
In pratica gli dico l'id della variabile e la rendo visibile (show) o no (hide).Codice PHP:{$('#tNum').show();}else{$('#tNum').hide();}"/
lo script invece è per "aggiornare" la pagina al flag?
Almeno imparo e non è solo un copia e incolla.
Grazie
ps funziona alla grande! Piccolo problemino,non so quale variabile usa e quanto assegna in caso di flag, perchè vorrei scrivere 2 paroline che compaiono, per far capire all'utente cosa inserire, ma solo nel caso flag selezionato. Pensavo a qualcosa tipo
Codice PHP:if(tNum=="tNum"){echo "inserisca valore";}
all'onclick viene richiamato lo script, che verifica se checked o no (this.checked). $('#tNum') seleziona l'elemento con id 'tNum', show e hide sono funzioni di jquery.
Ti posto una versione migliorata e completa con i commenti... spero d'aver spiegato bene...
Per quanto riguarda jQueri, sul sito trovi la documentazione con una miriade di esempi d'uso e demo.Codice PHP:<html>
<head>
</head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
/* questa funzione filta i tasti premuti ammettendo solo i numeri */
$.fn.NumericOnly = function(){
return this.each(function()
{
$(this).keydown(function(e)
{
var key = e.charCode || e.keyCode || 0;
return (
key == 8 ||
key == 9 ||
key == 46 ||
(key >= 37 && key <= 40) ||
(key >= 48 && key <= 57) ||
(key >= 96 && key <= 105));
});
});
};
function check(el){
if(el.checked){
/* *
* .val() -> inserisce un testo in #tNum
* .NumericOnly() -> applica la funzione solo numeri
* .focus() chimama .select() e fa in modo che se #tNum ottiene il focus, venga selezionato tutto il contenuto
* fadeIn() e .fadeOut() sono come hide e show ma con effetto di fade
* */
$('#tNum').val("Insert a number").NumericOnly().focus(function(){
this.select();
}).fadeIn();
}else{
$('#tNum').fadeOut();
}
return false;
}
</script>
<body>
<input type="checkbox" id="box" name="box" onclick="check(this);"/>
<input type="text" id="tNum" name="tNum" style="display: none;"/>
</body>
</html>
Se ti servisse: http://docs.jquery.com/Main_Page
GRAZIE! Un po' in ritardo (pensavo di aver risposto,ma mi sa di aver sbagliato qualcosa)
Gentilissimo, figo anche il fatto che controlli e faccia inserire solo numeri, sarebbe stato perfetto anche per me (purtroppo così non prende la virgola (o il punto) e mi serviva float, comunque sei stato gentilissimo in fondo non te lo avevo neanche chiesto).
Hai spiegato bene, non ho capito perchè l'uso delle funzioni?Quando si toglie-mette la spunta al flag non si aggiorna da sola la pagina?
Pensavo di mettere quel insert a number di fianco e non dentro al form, posso mettere solo l'if?, qualcosa tipo:
oppure devo metterlo nella funzioneCodice PHP:if(el.checked){
echo"Inserite valore";
}
Codice PHP:function check(el){
if(el.checked){
echo"Inserite valore";
} }
No, non si aggiorna la pagina in javascript, è eseguito lato client, non fa richieste al server. Le funzioni non le puoi evitare...
Prova questo, la validazione ora è sui float, ammette un solo punto, e il testo è di fianco
Codice PHP:<html>
<head>
</head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
/* questa funzione filta i tasti premuti ammettendo solo i numeri */
$(document).ready(function(){
$('#tNum').val("0.0").FloatNumericOnly().focus(function(){
this.select();
});
});
$.fn.FloatNumericOnly = function(){
return this.each(function()
{
$(this).keydown(function(e)
{
var dot = ($(this).val().indexOf('.')!=-1);
var len = ($(this).val().length);
var key = e.charCode || e.keyCode || 0;
return (
key == 8 ||
key == 9 ||
key == 46 ||
((key == 190 || key == 110) && !dot && len > 0) ||
(key >= 37 && key <= 40) ||
(key >= 48 && key <= 57) ||
(key >= 96 && key <= 105));
});
});
};
function check(el){
if(el.checked){
/* *
* .val() -> inserisce un testo in #tNum
* .NumericOnly() -> applica la funzione solo numeri
* .focus() chimama .select() e fa in modo che se #tNum ottiene il focus, venga selezionato tutto il contenuto
* fadeIn() e .fadeOut() sono come hide e show ma con effetto di fade
* */
$('#tNum').val("0.0")
$('#toshow').fadeIn();
}else{
$('#toshow').fadeOut();
}
return false;
}
</script>
<body>
<input type="checkbox" id="box" name="box" onclick="check(this);"/>
<div id="toshow" style="display: none;"><input type="text" id="tNum" name="tNum"/><span id="message">Inserire un numero</span></div>
</body>
</html>
Lo provo subito! Grazie
Funziona perfettamente!! per usarne 2? Devo creare con un dupplicato di funzioni?
Perdona la mia ignoranza
Ps Scusami se non ti ho detto subito che erano 2, ma non sapevo che ne servivano 2.
Specifico 2 flag (indipendenti) con i rispettivi form dipendenti dal rispettivo flag.
Flag 1 (se flag 1 attivo, allora mostra messaggio1 e campo 1)
Flag 2 (se flag 2 attivo allora mostra messaggio2 e campo 2)
messaggio 1 e 2 sono messaggi all'utente per far capire cosa inserire.
Esattamente come ha fatto darkonme, ma 2 volte (mea culpa)
Non c'è più bisogno, ci sono riuscito
Permessi di invio
Rispondi quotando