php y ventana modal

[falkon765]

tengo esto

Código PHP:

  <?php
$sql = "SELECT * FROM usuario where nombre like '$buscar%'";
           
                 $rs = $conexion ->query($sql);
                 while ($fila = $rs->fetch_assoc()){
echo '<section class="clase2">';
            $id = $fila['id_usuario'];
            ?>
<article class="clase3" onclick = "window.location='#openModal?id=<?=$id?>'" onmouseover="this.style.backgroundColor='#999'" onMouseout="this.style.backgroundColor=''" >
           <?php     
                
                 echo '<div class="usuario">'.$fila['usuario'].'</div>';
                 echo '<div class="nombre">'.$fila['nombre'].'</div>';
                 echo '<div class="apellido">'.$fila['apellido'].'</div>';
                 echo '<div class="rut">'.$fila['rut'].'</div>';
                 echo '<div class="clave">'.$fila['clave'].'</div>';
            echo '</section>';
            echo '</article>';
}   

que me devuelve los usuarios. Digamos que me devuelve 5 usuarios con una id distinta por cada usuario OK?.

y tengo esto

Código HTML:

<a href="#openModal">Open Modal</a>
   <div id="openModal" class="modalDialog">
    <div>
        <a href="#close" title="Close" class="close">X</a>
 
        
    </div>
   </div>
 

Código CSS:

.modalDialog {
        position: fixed;
        font-family: Arial, Helvetica, sans-serif;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: rgba(0,0,0,0.8);
        z-index: 99999;
        opacity:0;
        -webkit-transition: opacity 400ms ease-in;
        -moz-transition: opacity 400ms ease-in;
        transition: opacity 400ms ease-in;
        pointer-events: none;
    }
 
    .modalDialog:target {
        opacity:1;
        pointer-events: auto;
    }
 
    .modalDialog > div {
        width: 400px;
        position: relative;
        margin: 10% auto;
        padding: 5px 20px 13px 20px;
        border-radius: 10px;
        background: #fff;
        background: -moz-linear-gradient(#fff, #999);
        background: -webkit-linear-gradient(#fff, #999);
        background: -o-linear-gradient(#fff, #999);
    }
 
    .close {
        background: #606061;
        color: #FFFFFF;
        line-height: 25px;
        position: absolute;
        right: -12px;
        text-align: center;
        top: -10px;
        width: 24px;
        text-decoration: none;
        font-weight: bold;
        -webkit-border-radius: 12px;
        -moz-border-radius: 12px;
        border-radius: 12px;
        -moz-box-shadow: 1px 1px 3px #000;
        -webkit-box-shadow: 1px 1px 3px #000;
        box-shadow: 1px 1px 3px #000;
    }
 
    .close:hover { background: #00d9ff; }
 

que me habre una ventana modal el problema es que cuando le hago click a uno de los 5 registro que me devuelve con window.location='#openModal' me habre la ventana vacia con y se la habro con window.location='#openModal?id=<?=$id?> no me la habre.
quiero pasar la id del usuario a la ventana para poder de hay modificar sus datos.
ayuda plz

[NSD]

Código Javascript:

window.location='?id=<?=$id?>#openModal'
 

[falkon765]

Iniciado por NSD

Código Javascript:

window.location='?id=<?=$id?>#openModal'
 

cuando hago eso me recarga la pagina pero con el id y cuando busco denuevo por segunda ves se habre el modal pero no aparece la id que le envio

Código HTML:

<div id="openModal" class="modalDialog">
    <div>
        <a href="#close" title="Close" class="close">X</a>
        
<?php      $id2 = $_GET['id'];
            echo $id2;
        ?>
       
        
    </div>
   </div>
 

[NSD]

Si el html de la ventana modal lo generas cuando cargas la pagina, es imposible que con javascript modifiques ese valor ya que php y javascript se ejecutan en dos momentos distintos y en dos lugares distintos.

Lo que debes hacer es usar ajax para cargar el contenido de la ventana modal.

Al momento de cargar la pagina por primera vez, dentro de la ventana modal pones una imagen o un cartelito de loading, luego, para abrir la ventana, la funcion debe realizar una peticion asincronica enviando el id, y luego mostrando el resultado