[SOLUCIONADO] Crear un formulario web con limite de 25 caracreres

eridamega · #1 (**permalink**) 12/01/2013, 12:49

Hola, necesito hacer un formulario web con donde la persona pueda seleccionar palabras y estos símbolos ♥ † ☺ ☮ ☠ ♫ ★ y se introduzcan en el formulario, a su vez que limite a 25 caracteres y diga cuantos falta para los 25.

les agradecería en el alma

rodrigo791 · #2 (**permalink**) 12/01/2013, 12:53

Y tienes algo hecho? por acá no hacemos trabajos por otros

a demas de que tampoco se entiende mucho lo que queres, necesitas un formulario, donde la persona selecciona palabras, selecciona simbolos y a su vez esos simbolos se introducen de nuevo en el formulario? no entendí nada eso.

eridamega · #3 (**permalink**) 12/01/2013, 17:19

Cita:

Iniciado por rodrigo791

Y tienes algo hecho? por acá no hacemos trabajos por otros

a demas de que tampoco se entiende mucho lo que queres, necesitas un formulario, donde la persona selecciona palabras, selecciona simbolos y a su vez esos simbolos se introducen de nuevo en el formulario? no entendí nada eso.

Si claro ya tengo hecho el formulario, lo que necesito es que no deje escribir mas de 25 caracteres y debajo de input me diga los caracteres que faltan para los 25, ejemplo si he escrito 4 que diga faltan 21

Código HTML:

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<style>
	ul>li{
		list-style-type: none;
		display: inline;
	}
	li>div{
		display: inline;
	}
	#contSimbolos{
		height: 80px;
		background-color: blanchedAlmond;
		overflow: auto;
		width: 470px;
	}
</style>
</head>
<body>
<form>
<input type="text" maxlength="25" id="texto" placeholder="Seleccione Simbolos" name="texto" style="font-family:Verdana;text-align:center;
font-size:18pt; color:#0000FF; background-color:#00FFFF" size=25>
<ul>
<li><div id="sim1" style="cursor: pointer;">♥</div></li>
<li><div id="sim2" style="cursor: pointer;">†</div></li>
<li><div id="sim3" style="cursor: pointer;">☺</div></li>
<li><div id="sim4" style="cursor: pointer;">☮</div></li>
<li><div id="sim5" style="cursor: pointer;">☠</div></li>
<li><div id="sim6" style="cursor: pointer;">♫</div></li>
<li><div id="sim7" style="cursor: pointer;">★</div></li>
<li><div id="sim8" style="cursor: pointer;">♈</div></li>
<li><div id="sim9" style="cursor: pointer;">♉</div></li>
</ul>

<script>
var open = false;
$('#contSimbolos').click(function() {
    if (open) {
        $(this).animate({height:'100px'}); 
    }
    else {
        $(this).animate({height:'150px'});
    }
    open = !open;
});

</script>
<script>
$(document).ready(function(){
$("#sim1").click(function(){
var input = $( "#texto" );
var simbolo = $("#sim1").text();
input.val( input.val() + simbolo );	
});

$("#sim2").click(function(){
var input = $( "#texto" );
var simbolo = $("#sim2").text();
input.val( input.val() + simbolo );	
});

$("#sim3").click(function(){
var input = $( "#texto" );
var simbolo = $("#sim3").text();
input.val( input.val() + simbolo );	
});

$("#sim4").click(function(){
var input = $( "#texto" );
var simbolo = $("#sim4").text();
input.val( input.val() + simbolo );	
});

$("#sim5").click(function(){
var input = $( "#texto" );
var simbolo = $("#sim5").text();
input.val( input.val() + simbolo );	
});

$("#sim6").click(function(){
var input = $( "#texto" );
var simbolo = $("#sim6").text();
input.val( input.val() + simbolo );	
});

$("#sim7").click(function(){
var input = $( "#texto" );
var simbolo = $("#sim7").text();
input.val( input.val() + simbolo );	
});

$("#sim8").click(function(){
var input = $( "#texto" );
var simbolo = $("#sim8").text();
input.val( input.val() + simbolo );	
});

$("#sim9").click(function(){
var input = $( "#texto" );
var simbolo = $("#sim9").text();
input.val( input.val() + simbolo );	
});


});
</script>
</form>	
</body>
</html>

memoadian · #4 (**permalink**) 12/01/2013, 20:40

limitar numero de caracteres con javascript

caricatos · #5 (**permalink**) 13/01/2013, 01:16

Hola:

Qué estructura más rara... li>div {display: inline;}... ¿Por qué no usar un span?

Saludos