Listado del cual solo me interesa que afecte a uno

[onatsu]

Buenas a todos, tengo un listado y dentro tengo una imagen, siempre la misma con el mismo id todo, lo que quiero es que al hacer click cambie esa imagen,

Me funciona, pero me cambia todas las imagenes, o si le pongo first, me cambia solo la primera.

Este es el codigo que utilizo:

Código PHP:

  <script type="text/javascript">
    $(document).ready(function(){
    $("a#active").click(function(evento){
            $("img#active_bt").attr({src: "images/style/act_off.png"});
            return false;
        });
    });        
</script>  
  

Muchas Gracias por la ayuda

[mayid]

con el mismo id todo

Esto que significa? No pueden existir dos elementos con el mismo id. Para eso esta el atributo de clase (class name).

Publica tu html por favor.

Esto:

$("img#active_bt").attr({src: "images/style/act_off.png"});

... es super especifico y no tiene por que cambiar sino esa imagen.

Ahora, si cada link tiene una imagen, podes usar este selector:

$("a#active").click(function(evento){
$(this + " img").attr({src: "images/style/act_off.png"});
return false;
});

Que es lo mismo que decir:

$("a#active img") , solo que usando $(this) para declarar que el punto de partida es el elemento que se clickeo.

[onatsu]

Tienes razon en lo de los id, me lie tanto intentando que funcionara que al final quean estas burradas.

Este es el Html limpito

Código HTML:

<ul>
<li>
        <a href='?sect=31&a=del&id=11&table=links' class='action_bt'>
<img src='images/style/del.png' /></a>					
	<a href='' class='action_bt active'><img src='images/style/act_on.png' class='active_bt'/></a>
        <a href='?sect=31&a=edit&id=11&table=links' ><img src='images/style/edit.png' class='action_bt'/>
        <h3>Primer item</h3></a>
</li>
<li>
        <a href='?sect=31&a=del&id=11&table=links' class='action_bt'>
<img src='images/style/del.png' /></a>					
	<a href='' class='action_bt active'><img src='images/style/act_on.png' class='active_bt'/></a>
        <a href='?sect=31&a=edit&id=11&table=links' ><img src='images/style/edit.png' class='action_bt'/>
        <h3>segundo item</h3></a>
</li>
etc...
</ul> 

Y asi es como me queda el script despues de tu cambio, pero sigue sin funcionarme, no entiendo muy bien comofunciona el This, y como utilizarlo, no hay algun tutorial sobre this?

Código PHP:

  <script type="text/javascript"> 
        $(document).ready(function(){ 
            $("a").click(function(evento){ 
                $(this + "img.active_bt").attr({src:"images/style/act_off.png"}); 
                return false; 
            }); 
        });         
    </script>  
  

Muchas Gracias por la ayuda

[mayid]

No hay tutorial pero podes sacar algunos ejemplos recorriendo el manual de jquery.

No te anda porque no dejastes un espacio aqui:

$(this + "img.active_bt")

No te lo avise antes, pero fijate que en mi ejemplo yo dejo eun espacio en blanco despues de las comillas:

$(this + " img").attr({src: "images/style/act_off.png"});

Aqui: " img" . Lo ves?

[hector2c]

sep sep sep!!! usa this!!!, por ejemplo

Código HTML:

$("#uno").click(function(){
  $(this).hide();
});

pos, el code hace que al darle click en id "uno", este! ó this! se ocultara XD

[mayid]

Si, pero la img esta dentro de un link, y estamos haciendo click en un link. Por eso al $(this) le agregamos un selector de childs:

$(this + " img")

con los cuidados que ya hablamos arriba, de dejar un espacio en blanco dentro de las comillas.

[hector2c]

aaaaaaa, entonces, tambien podria ser asi???

Código HTML:

$("#uno").click(function(){
  $(this).find("img").eq(0).attr('src', 'conejo.jpg');
});

mayid, disculpa no lei totalmente tooo el post!!! buen dato!!!

[mayid]

Supongo que funcionaria.

Yo suelo usar alternativamente:

$(this).children("img").attr('src', 'conejo.jpg');

[hector2c]

mmmm....

Código HTML:

$(this).children("img").attr('src', 'conejo.jpg');

mmm, en este caso el selector children modificaría a tooos los img que esten en this :S, no es muy general???, se le podria agregar un .eq()...

aunque... "Supongo que funcionaria" XDD!!!

[mayid]

Y si, es muy general, pero si cada enlace tiene solo una foto, entonces va bien.

[onatsu]

Buff muchas gracias por vuestras respuestas y por vuestro esfuerzo, he conseguido que solo me cambie la imagen que me interesa, aunque el código que he utilizado es el siguiente, por que el que me ponéis no me funcionaba:

Código HTML:

<script type="text/javascript">
	    $(document).ready(function(){
			$("a.active").click(function(){
				$("img.active_bt", this).attr({src: "images/style/act_off.png"}
				return false;
			});
		});        
	</script> 

Con esto consigo que el boton cambia de activo a inactivo, que era en un principio lo que queria, pero ahora necesito que ademas de cambiar, modifique en la base de datos el registro actual de activo a inactivo, y no hay manera, si le doy se lee todos los li que hay en listado, no puedo hacer que solo se ejecute una consulta en base a este.

No se si me explico muy bien.

Lo intento resumir, yo tengo un listado, de productos, de una base de datos, representada por un li cada uno, estos tienen varios botones para eliminar editar etc, y tambien un boton tipo switch que quiero que cambie de color y que en la base de datos se marque como activo o inactivo dependiendo de su estado.



POngo una imagen para ilustrarlo, se entiende mejor?

[onatsu]

Bueno lo he conseguido, aunque no estoy seguro de que el codigo quede muy bonito, os lo pego aqui, por si alguien le sirve, y tambien por si alguien se le ocurre como mejorarlo

Código HTML:

 <script type="text/javascript">
	    $(document).ready(function(){
			$("a.active").click(function(){
				id = $(this).attr('href');
				a = $(this).children("img").attr('src');
				t = $(this).attr('table');
				$(this).load("core/library/active.php",{table:t,active:a,id:id});
				return false;
			});
		});        
	</script> 

Y aqui el código que lo recibe:

Código PHP:

      $table = $_POST[table]; 
    $id = $_POST[id]; 
    $active = $_POST[active]; 
     
    if($active == "images/style/act_on.png"){ 
        $act = 2; 
    }else{ 
        $act = 1; 
    } 
     
    $query = "update $table set active = $act where id_$table = $id"; 
     
    $sql = mysql_query($query); 
     
    if($act == 1){ 
        echo "<img src='images/style/act_on.png' class='active_bt'/>"; 
    }else{ 
        echo "<img src='images/style/act_off.png' class='active_bt'/>"; 
    }  
   

Espero que sirva! un saludo y gracias

[mayid]

Estan muy lindos los switchs. Yo quiero unos asi, puedo?

[onatsu]

A que te refieres con que si puedes? a los png? claro! si quieres te los envío en mp.