[SOLUCIONADO] duda con compatibilidades

[Doch]

Hola buenas, tengo el siguiente código en javascript

Código Javascript:

function close_alert(id) {
    
    var alert_div = document.getElementById('alert_container_'+id+'');
    var cookie_name = "YRO_alert_id_" + id;
    $(alert_div).fadeOut(400);
    
    document.cookie = ""+cookie_name+"="+ id +"; expires=Thu, 1 Dec 2015 12:00:00 GMT";
 
}
 

y este en HTML

Código HTML:

<div id =\"alert_container_$alert_id\"  style=\"overflow: hidden; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; box-shadow: 0px 0px 0px 1px #5A5D63;-webkit-box-shadow: 0px 0px 0px 1px #5A5D63;border: 1px solid #000;\">
    <table class=\"alert alert-".$alert_class."\">
        <tr>
            <td class =\"alert_text\" >
                    ".$alert_text."
                </td> 
                <td>
                <button style=\"float:right; outline:0; margin-right:8px;\" class=\"btn btn-$alert_class\">
                    <a href=\"#\" onclick=\"close_alert($alert_id)\" title=\"".$LNG['alert_close']."\">
                        <i class=\"icon-remove icon-white\"></i>
                    </a>
                </button>
                </td>
        </tr>
    </table>
</div>
 

Bueno la funcion principal es que si se clica el boton, el div se esconde con un efecto de fadeOut y se añade la cookie para que este no se muestre otra vez.

la cosa es que en chrome va perfectamente, pero en mozilla e internet explorer el boton no hace nada.. Alguna idea? es este el mejor metodo para este "sistema de alertas"?

PD: no os preocupeis por el CSS del style.

[Doch]

analizando un poco con mozilla, avisa de que al al llamar a la funcion con el button, se le pasa una cadena vacia, sin embargo se le pasa $alert_id.. (Cadena vacía pasada a getElementById())

[Doch]

ni idea nadie?

[PHPeros]

Como no podemos ver las variables de PHP...

[Doch]

la variable "$alert_id" es seguro que es un numero entero, ya que es un ID que ademas se crea sola al insertar el registro en la base de datos.

$alert_class, no tiene nada que ver con el problema pero es un string que puede ser primary,danger,alert para hacer el tipico globo de alerta de bootstrap.

$alert_text, no es mas que el texto que tiene que enseñar.

[Doch]

segun estoy viendo por internet, nadie sabe resolver el problema o incluso dicen que es problema de firefox, porque en chrome funciona, en IE tampoco funciona ( para variar ) alguien sabria una forma diferente de como hacerlo?

yo ahora mismo lo tengo como:

php mira la base de datos y recoje las alertas(id,texto,clase...), luego mira las cookies para mostar solo las alertas que no han sido cerradas antes, estas se muestran con un id en el div diferente cambiando solo el valor del final por ejemplo : alerta_1, alerta_2... ademas tengo el boton de cerrado que onClick llama a la funcion javascript pasandole como parametro la id del alert.

esta funcion recibe el parametro y busca el id que tiene el numero del parametro al final ej: alert_2 y lo que haces es un fadeOut para quitarlo de pantalla y hace un set de una cookie para marcarlo como visto y no se muestre la proxima vez que se cargue la web

el problema tiene origen al llamar desde html la funcion javascript pasandole el parametro que marca como error Cadena vacía pasada a getElementById().

A ver si alguien tiene otro metodo diferente, se que esto es posible de hacer.. la cosa es como




ejemplo de script enlace si bajais un poco os aparecera la barra, si la cerrais se os añadira una cookie llamada "awesomeBarDisabled" y no os aparacera la barra si refrescais la web

[Carlangueitor]

Sin ver más ayá ni leer tu segundo comentario, el problema es esto:

Código HTML:

alert_container_$alert_id
 

Tienes que concatenar $alert_id.


Saludos

[Doch]

Esa opcion ya la probe, de hecho al cargar la pagina se muestra correctamente "alert_container_1", el problema esta al llamar a la funcion en el onClick

Código PHP:

  $TMPL['alerts_divs'] = $TMPL['alerts_divs'] . "<div id =\"alert_container_".$alert_id."\"  style=\"overflow: hidden; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; box-shadow: 0px 0px 0px 1px #5A5D63;-webkit-box-shadow: 0px 0px 0px 1px #5A5D63;border: 1px solid #000; margin-bottom:15px;\">
    <table class=\"alert alert-".$alert_class."\">
        <tr>
            <td class =\"alert_text\" >
                    ".$alert_text."
                </td> 
                <td>
                <button style=\"float:right; outline:0; margin-right:8px;\" class=\"btn btn-$alert_class\">
                    <a href=\"#\" onClick=\"close_alert('".$alert_id."');\" title=\"".$LNG['alert_close']."\">
                        <i class=\"icon-remove icon-white\"></i>
                    </a>
                </button>
                </td>
        </tr>
    </table>
</div>";  
   

[Doch]

las soluciones tan tontas de ponen negro..

Código PHP:

  <button style="float:right; outline:0; margin-right:8px;\" class=\"btn btn-$alert_class\">
                    <a href=\"#\" onClick=\"close_alert('".$alert_id."');\" title=\"".$LNG['alert_close']."\">
                        <i class=\"icon-remove icon-white\"></i>  
   

cambiamos a

Código PHP:

  <button href="#\" onClick=\"close_alert('".$alert_id."');\" style=\"float:right; outline:0; margin-right:8px;\" class=\"btn btn-$alert_class\">
                    <a title=\"".$LNG['alert_close']."\">
                        <i class=\"icon-remove icon-white\"></i>  
   

EDIT: me he dado cuenta que en el 2º bloque de PHP el el href, la primera comilla no esta escapada, aunque de hecho lo esta pero por algun motivo no se muestra