Detectar mayúscula en un INPUT

adex · #1 (**permalink**) 23/05/2007, 00:27

Hola amigos del foro:
No estoy seguro si realmente se pueda hacer esto, he buscado por todo
ForosdelWeb, pero solo encontré que detecta la primera letra en un campo; Mi lío es lo siguiente:

Tengo un input

Código PHP:

  <input type="text" name="detalle" value="">

pero solo quiero permitir máximo tres palabras completas en mayúscula
ejemplo

Válido:
Viajando por MADRID encontré a Juan Carlos con María

No válido:
Viajando por MADRID encontré a JUAN CARLOS CON MARÍA

Espero haberme hecho entender, y gracias por anticipado

KarlanKas · #2 (**permalink**) 23/05/2007, 01:13

Lo que planteas tiene la dificultad de que es dificil descubrir que palabras pueden empezar con mayúsculas y qué palabras no. En tu ejemplo la palabra CON debería escribirse con minúsculas, pero sería complicado hacer algo así porque requeriría crear un diccionario de palabras que nunca abarcaría todo lo que se puede escribir.

Te he hecho un script que deja la primera letra de cada palabra como está escrita y el resto las pone en minúsculas. Como verás es prácticamente lo que buscas:

Código PHP:

  <html> 
<head> 
    <title>Untitled</title> 
     
<script> 
    function mayusculas(aqui){ 
                 var pepe="KarlanKas"; 
        palabras=aqui.value.split(" "); 
        for(a=0;a<palabras.length;a++){ 
            letra=palabras[a].charAt(0); 
            palabras[a] = letra + palabras[a].substring(1 , palabras[a].length).toLowerCase(); 
             
        } 
        texto=""; 
        for(a=0;a<palabras.length;a++){ 
            if(a>0){texto+=" ";} 
            texto+=palabras[a]; 
        } 
        aqui.value=texto; 
    } 
</script> 
</head> 
 
<body> 
<input type = "text" name = "prueba" size = "50" style = "border:solid 1px black; font: normal 10px/10px verdana" onkeyup = "mayusculas(this)"/> 
 
 
</body> 
</html>

Espero que te sirva!

adex · #3 (**permalink**) 23/05/2007, 01:25

Hola KarlanKas gracias por responder me ahorraste hacer otro post para este problema gracias eh...

Pero con respecto a este problema planteado creo que no me dejé entender;
lo que quiero es evitar que pongan más de tres palabras seguidas en
mayúsculas y cuando lo hagan envíe un alert avisando tal acción,
gracias nuevamente por la paciencia!

KarlanKas · #4 (**permalink**) 23/05/2007, 02:19

¿así?

Código PHP:

  <html>  
<head>  
    <title>Untitled</title>  
      
<script>  
    function mayusculas(aqui){  
        var pepe="KarlanKas"; 
        var maximo=3; 
        var p_mayusculas=0; 
        var palabras=aqui.value.split(" ");  
        for(a=0;a<palabras.length;a++){  
            if(palabras[a]==palabras[a].toUpperCase() && palabras[a] != ""){ 
            p_mayusculas+=1; 
            } 
        }  
        if (p_mayusculas>=maximo){ 
        alert("Por favor, no escriba más de "+maximo+" palabras en mayusculas") 
        } 
         
    }  
</script>  
</head>  
 
<body>  
<input type = "text" name = "prueba" size = "50" style = "border:solid 1px black; font: normal 10px/10px verdana" onblur = "mayusculas(this)"/>  
 
 
</body>  
</html>

derkenuke · #5 (**permalink**) 23/05/2007, 05:51

Creo que podría ser también así:

Código:

function comprobar(q) {
	return /(^| )[A-Z]+ [A-Z]+ [A-Z]+( |$)/.test(q);
}

Lo único que hay que hacer es sustituir o añadir a A-Z los caracteres que pueden formar una palabra: tildes (ÁÉÍÓÚ), diéresis, eñe... todos los que no aparecen en el inglés y lo que te parezca a ti (guiones etc).

Un saludo.

adex · #6 (**permalink**) 02/06/2007, 21:04

Cita:

Iniciado por KarlanKas

[font=courier new]¿así?[php]<html>
<head>
<title>Untitled</title>

<script>
function mayusculas(aqui){
var pepe="KarlanKas";
var maximo=3;
(...)

Gracias KarlanKas por tu ayuda perdona que no haya respondido a tiempo ya sabes, los exámenes distraen mucho.

Amigo KarlanKas, todo marcha bien al hacer click me sale el alerta, pero luego se pasa al siquiente campo, y no debería pasar eso hasta cumplir las indicaciones del Alert (osea la sugerencia de no escribir más de 3 palabras en mayúsculas)

Gracias nuevamente por tu ayuda!

adex · #7 (**permalink**) 02/06/2007, 21:20

buscando en el foro econtré esto y funciona bien:

document.MiForm.prueba.focus();

de tal manera que quedó así:

Código PHP:

  (...) 
        if (p_mayusculas>=maximo){  
        alert("Por favor, no escriba más de "+maximo+" palabras en mayusculas") 
document.MiForm.prueba.focus(); 
        }

Si hay otra forma más óptima de hacerlo estaría agradecido
Muchas gracias KarlanKas y atí también derkenuke, no entendí muy bien tu propuesta pero te agradezco!

KarlanKas · #8 (**permalink**) 04/06/2007, 01:14

Pon mejor, en vez de:

document.MiForm.prueba.focus();

(que no está mal). Pon esto:

aqui.focus();

De nada hombre! La propuesta de derkenuke es muy interesante. Se basa en emplear expresiones regulares. En principio esa simple línea hace lo mismo que todo mi script.

Un saludo!
[/font]

derkenuke · #9 (**permalink**) 04/06/2007, 02:57

Sí, no es tan dificil de entender la función con expresiones regulares:

Cita:

/(^| )[A-Z]+ [A-Z]+ [A-Z]+( |$)/

Esto es un patrón, un conjunto abstracto de cadenas. Al contrastarlo con una cadena cualquiera gracias al método test nos devuelve true o false si ese string esta incluido en el conjunto representado por la expresion regular.

Esa quiere decir
(^| ) ==> buscamos inicio de cadena (^) o un espacio en blanco ( )
[A-Z]+ ==> buscamos una letra del abecedario en mayusculas, de la A a la Z. Ademas que se repita una o varias veces
==> un espacio en blanco
( |$) ==> buscamos un espacio en blanco ( ) o fin de cadena ($).

Es asi de "simple". Si te interesa saber mas, hay informacion variada por internet.

Un saludo.

adex · #10 (**permalink**) 04/06/2007, 03:15

Interesante las cosas que se podría hacer derkenuke, si no es mucha molestia como estaría adaptado al input?

Código HTML:

<input type="text" name="detalle" value="">

supongo que el JS quedaría así:

Código:

<SCRIPT LANGUAGE="JavaScript">
function comprobar(q) {
	return /(^| )[A-Z]+ [A-Z]+ [A-Z]+( |$)/.test(q);
}
</SCRIPT>

derkenuke · #11 (**permalink**) 04/06/2007, 06:12

Por ejemplo, podría ser así (sugerencia de presentación jeje)

Código PHP:

  <input type="text" name="detalle" value="" onblur="comprobar(this)">
<div id="info" style="width:500px;"></div>

<script type="text/JavaScript">
var info=document.getElementById("info");
function comprobar(q) {
    var tres_mayusculas = /(^| )[A-Z]+ [A-Z]+ [A-Z]+( |$)/.test(q.value);
    if( tres_mayusculas ) {
        q.style.backgroundColor=info.style.backgroundColor="#f88";
        info.innerHTML="No puedes tener tres palabras o más seguidas que estén en mayúsculas";
        q.focus();
    }
    else {
        q.style.backgroundColor="#8f8";
        info.style.backgroundColor="";
        info.innerHTML="";
    }
}
</script>

Asociado al evento onblur, para cuando se pierda el foco del campo.

Saludos.