Select con javascript

jotun · #1 (**permalink**) 23/08/2007, 13:50

Hola amigos aqui primero que nada deje el codigo entero

tengo 4 select X con valores como pueden ver

Cual es mi problema....

nesecito que el mensaje alert me muestre los artistas con sus canciones que tiene repetida la posicion en el select ke que quiero decir

si todos los select tienen posicion 1, el alert que muestre los 4 registros de los cantantes para saber cuales estan repetidos

la verdad que el mensaje tambien podria ser que se marquen con algun color no se he intentado de todo pero no me resulta nada
este ultimo script lo hace pero cuando se repiten mas de 3 veces el mismo valor repite el mensaje 2 veces

gracias amigos cualquier ayuda urgente es de suma importancia confio en el foro
gracias

<html>
<head>
<script>
function valida_posicion(){
var objetodiv=document.getElementById("algo");
var numselects=14;
var i, nombre_actual,repetidos="";
var a=new Array(14);
for(i=0;i<numselects;i++)
a[i] = document.getElementById("posicion_actual"+(i+1)).v alue;
a.sort();
error=false;
for(i=0;i<numselects;i++){
if(a[i]==a[i+1])
{
error=true;
for(j=0;j<numselects;j++){
pos=document.getElementById("posicion_actual"+(j+1 )).value;
if(a[i] == pos && i!=j){
repetidos = repetidos + "Interprete: " + document.getElementById("interprete"+(j+1)).value + " - Cancion: " + document.getElementById("titulo"+(j+1)).value + "\n\n";
}
}
}
}
if(error==false)
return confirm("¿Esta seguro de guardar estas posiciones?");
else{
//objetodiv.innerHtml(repetidos);
// objetodiv.style.visibility="visible";
alert("Posición actual duplicadas en los siguientes artistas: \n\n"+repetidos);
return false;
}
}
</script>
</head>
<body>
<form name="form1">
<table>
<tr>
<td>
<select name="posicion_actual1" id="posicion_actual1" >
<option value="1" >1</option>
<option value="2" >2</option>
<option value="3" >3</option>
<option value="4" >4</option>
<option value="5" >5</option>
</select>
<input type="hidden" name="interprete1" id="interprete1" value="Juan Perez1">
<input type="hidden" name="titulo1" id="titulo1" value="cancion 1">
</td>
</tr>
<tr>
<td>
<select name="posicion_actual2" id="posicion_actual2" >
<option value="1" >1</option>
<option value="2" >2</option>
<option value="3" >3</option>
<option value="4" >4</option>
<option value="5" >5</option>
</select>
<input type="hidden" name="interprete2" id="interprete2" value="Juan Perez2">
<input type="hidden" name="titulo2" id="titulo2" value="cancion 2">
</td>
</tr>
<tr>
<td>
<select name="posicion_actual3" id="posicion_actual3" >
<option value="1" >1</option>
<option value="2" >2</option>
<option value="3" >3</option>
<option value="4" >4</option>
<option value="5" >5</option>
</select>
<input type="hidden" name="interprete3" id="interprete3" value="Juan Perez3">
<input type="hidden" name="titulo3" id="titulo3" value="cancion 3">
</td>
</tr>
<tr>
<td>
<select name="posicion_actual4" id="posicion_actual4" >
<option value="1" >1</option>
<option value="2" >2</option>
<option value="3" >3</option>
<option value="4" >4</option>
<option value="5" >5</option>
</select>
<input type="hidden" name="interprete4" id="interprete4" value="Juan Perez4">
<input type="hidden" name="titulo4" id="titulo4" value="cancion 4">
</td>
</tr>
</table>
<input type="submit" name="validar" value="Validar" onclick="javascript: return valida_posicion()">
</form>
</body>
</html>

derkenuke · #2 (**permalink**) 23/08/2007, 16:53

Hola jotun:

La verdad es que me ha parecido un poquito complicado tu código. No lo he intentado comprender, pero lo he re-hecho dándole más legibilidad y aportándole -creo- más datos (veces de repetición). También me he ahorrado un par de variables. Y he cambiado la manera de obtener los selects. Ahora no hace falta decirle al script el número que tienes, con que sigan el esquema "posicion_actualXX" siendo XX un número entero ya se almacenan en el array. Cuidado si tienes más selects con esa estructura en el documento, habría que capar la obtención únicamente a tu formulario form1, por ejemplo.

Me ha hecho falta declarar una pequeña función cuantasVecesEsta(n) para ver cuántas veces está un valor dado (n) en un array concreto. A partir de ahí el script sale casi sólo, lo más difícil es no comprobar otra vez si se están repitiendo los valores que ya hemos comprobado (saltamos iteraciones dentro del for):

Código PHP:

  <html> 
<head> 
<script type="text/javascript"> 
 
Array.prototype.cuantasVecesEsta = function(n) { 
    for(var i=0, cont=0; i<this.length; i++) 
        if( this[i] === n ) 
            cont++; 
    return cont; 
} 
 
function valida_posicion(){ 
    // String para alertar del error 
    var repetidos=""; 
    // Almacenamos los values de todos los selects con id posicion_actualXX (XX es un entero) en el array a. 
    var a=new Array(), elSelect; 
    for(var i=1; (elSelect = document.getElementById("posicion_actual"+i) ) ; i++) 
        a[i-1] = elSelect.value; 
    // Ordenamos para que los valores repetidos estén seguidos 
    a.sort(); 
    // Comprobamos si hay repeticiones y cuántas hay 
    for(var i=0; i<a.length; i++) { 
        var cuantosHay = a.cuantasVecesEsta( a[i] ); 
        // El a[i] está cuantosHay veces en el array a; 
        if( cuantosHay > 1 ){            // Si hay más de uno, está repetido 
            var interprete = document.getElementById( "interprete"+(a[i]) ).value; 
            var cancion = document.getElementById( "titulo"+(a[i]) ).value; 
            repetidos += "Intérprete: " + interprete + " - Canción: " + cancion + ".\n"; 
            repetidos += "(repetido "+cuantosHay+" veces)\n\n"; 
        } 
        // Nos saltamos cuantosHay-1 posiciones en la iteración, para no volver a comprobar los repetidos. El -1 es porque nos hemos contado a nosotros mismos. Así, si hay 1,1,1,2 del primer 1(pos=0) pasamos directamente al 2(pos=3 = 0+3-1, +1 de la iteracion). Si cuantosHay=1 entonces la i no se varía, y se suma 1 en el bucle. cuantosHay no puede ser < 1. 
        i += cuantosHay-1; 
    } 
 
    if( repetidos != "" ) {            // Ha habido error 
        alert("Posición actual duplicadas en los siguientes artistas: \n\n"+repetidos); 
        return false; 
    } 
    else {                            // Ningún error 
        return confirm("¿Está seguro de guardar estas posiciones?"); 
    } 
 
} 
</script> 
</head> 
 
 
<body> 
<form name="form1"> 
<table> 
    <tr> 
        <td> 
        <select name="posicion_actual1" id="posicion_actual1" > 
            <option value="1" >1</option> 
            <option value="2" >2</option> 
            <option value="3" >3</option> 
            <option value="4" >4</option> 
            <option value="5" >5</option> 
        </select> 
        <input type="hidden" name="interprete1" id="interprete1" value="Juan Perez1"> 
        <input type="hidden" name="titulo1" id="titulo1" value="cancion 1"> 
        </td> 
    </tr> 
    <tr> 
        <td> 
            <select name="posicion_actual2" id="posicion_actual2" > 
                <option value="1" >1</option> 
                <option value="2" >2</option> 
                <option value="3" >3</option> 
                <option value="4" >4</option> 
                <option value="5" >5</option> 
            </select> 
            <input type="hidden" name="interprete2" id="interprete2" value="Juan Perez2"> 
            <input type="hidden" name="titulo2" id="titulo2" value="cancion 2"> 
        </td> 
    </tr> 
    <tr> 
        <td> 
            <select name="posicion_actual3" id="posicion_actual3" > 
                <option value="1" >1</option> 
                <option value="2" >2</option> 
                <option value="3" >3</option> 
                <option value="4" >4</option> 
                <option value="5" >5</option> 
            </select> 
            <input type="hidden" name="interprete3" id="interprete3" value="Juan Perez3"> 
            <input type="hidden" name="titulo3" id="titulo3" value="cancion 3"> 
        </td> 
    </tr> 
    <tr> 
        <td> 
            <select name="posicion_actual4" id="posicion_actual4" > 
                <option value="1" >1</option> 
                <option value="2" >2</option> 
                <option value="3" >3</option> 
                <option value="4" >4</option> 
                <option value="5" >5</option> 
            </select> 
            <input type="hidden" name="interprete4" id="interprete4" value="Juan Perez4"> 
            <input type="hidden" name="titulo4" id="titulo4" value="cancion 4"> 
        </td> 
    </tr> 
</table> 
<input type="submit" name="validar" value="Validar" onclick="return valida_posicion()"> 
</form> 
</body> 
</html>

Espero que así sea como lo quieres.

Un saludo.