Skip to main content
se añadieron 643 caracteres en el cuerpo
Origen Enlace
Federico
  • 1.5k
  • 12
  • 23

tendrias que crear un boton y una estructura de div por ejemplo :

<button type="button" id="button" onclick="abrirPopup">
   Abrir popup
</button>
<div id="popup-bg">
   <div id="popup-div-principal>
     <div class="cerrar-popup" title="cerrar el popup" onclick="cerrarPopup()">
        <p>X</p>
     </div>
   </div>
</div>

el primer div seria el fondo, osea le podes poner que sea negro semitrasparente para opacar el resto del contenido y sobretodo debe tener el display: none; y position: absolute; para que no se vea de entrada y para que puedas jugar con el top, botton, right y left para darle la posicion.

lo que falta ahora es hacerlo aparecer cuando le das click al boton y eso se hace de la siguiente manera :

 //JavaScript puro
 //agarramos el div de fondo 
 var miDiv = document.getElementById("popup-bg");
 
 function abrirPopup() {
    miDiv.style.display = "block";
 }

 function cerrarPopup() {
    miDiv.style.display = "none";
 }
   

EDIT

creas el div del popup adentro del ciclo for en el cual tomas los datos de la tabla

<body>
  <table>
     <tr>
        <th>titulo</th>
        <th>titulo 2 </th>
     </tr>
     <tr>
        <td>primera linea</td>
        <td><button>editar<<td><button id="boton">editar</button></td>
     </tr>
     <div class="popup-bg">
        <div class="main-popup">
          <input type="hidden" name="id" value="<?=$inmueble[$var]['id']?>">
        </div>
     </div>
  </table>
</body>

EDIT 2

o usando JQuery :

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

function abrirPopup(){
      $("button#boton").on('click', function() {
          var row = $(this).closest('tr').index());
          $("div#popup-bg").toggle();
      }

y despues utilizas la variable row para tener el index del elemento que selecciono el utente y ahi tendrias que ver vos, sin ver el codigo php se me hace dificil decirte mas :) espero sirva de ayuda, exitos

tendrias que crear un boton y una estructura de div por ejemplo :

<button type="button" id="button" onclick="abrirPopup">
   Abrir popup
</button>
<div id="popup-bg">
   <div id="popup-div-principal>
     <div class="cerrar-popup" title="cerrar el popup" onclick="cerrarPopup()">
        <p>X</p>
     </div>
   </div>
</div>

el primer div seria el fondo, osea le podes poner que sea negro semitrasparente para opacar el resto del contenido y sobretodo debe tener el display: none; y position: absolute; para que no se vea de entrada y para que puedas jugar con el top, botton, right y left para darle la posicion.

lo que falta ahora es hacerlo aparecer cuando le das click al boton y eso se hace de la siguiente manera :

 //JavaScript puro
 //agarramos el div de fondo 
 var miDiv = document.getElementById("popup-bg");
 
 function abrirPopup() {
    miDiv.style.display = "block";
 }

 function cerrarPopup() {
    miDiv.style.display = "none";
 }
   

EDIT

<body>
  <table>
     <tr>
        <th>titulo</th>
        <th>titulo 2 </th>
     </tr>
     <tr>
        <td>primera linea</td>
        <td><button>editar</button></td>
     </tr>
     <div class="popup-bg">
        <div class="main-popup">
          <input type="hidden" name="id" value="<?=$inmueble[$var]['id']?>">
        </div>
     </div>
  </table>
</body>

tendrias que crear un boton y una estructura de div por ejemplo :

<button type="button" id="button" onclick="abrirPopup">
   Abrir popup
</button>
<div id="popup-bg">
   <div id="popup-div-principal>
     <div class="cerrar-popup" title="cerrar el popup" onclick="cerrarPopup()">
        <p>X</p>
     </div>
   </div>
</div>

el primer div seria el fondo, osea le podes poner que sea negro semitrasparente para opacar el resto del contenido y sobretodo debe tener el display: none; y position: absolute; para que no se vea de entrada y para que puedas jugar con el top, botton, right y left para darle la posicion.

lo que falta ahora es hacerlo aparecer cuando le das click al boton y eso se hace de la siguiente manera :

 //JavaScript puro
 //agarramos el div de fondo 
 var miDiv = document.getElementById("popup-bg");
 
 function abrirPopup() {
    miDiv.style.display = "block";
 }

 function cerrarPopup() {
    miDiv.style.display = "none";
 }
   

EDIT

creas el div del popup adentro del ciclo for en el cual tomas los datos de la tabla

<body>
  <table>
     <tr>
        <th>titulo</th>
        <th>titulo 2 </th>
     </tr>
     <tr>
        <td>primera linea</td>
        <td><button id="boton">editar</button></td>
     </tr>
     <div class="popup-bg">
        <div class="main-popup">
          <input type="hidden" name="id" value="<?=$inmueble[$var]['id']?>">
        </div>
     </div>
  </table>
</body>

EDIT 2

o usando JQuery :

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

function abrirPopup(){
      $("button#boton").on('click', function() {
          var row = $(this).closest('tr').index());
          $("div#popup-bg").toggle();
      }

y despues utilizas la variable row para tener el index del elemento que selecciono el utente y ahi tendrias que ver vos, sin ver el codigo php se me hace dificil decirte mas :) espero sirva de ayuda, exitos

se añadieron 590 caracteres en el cuerpo
Origen Enlace
Federico
  • 1.5k
  • 12
  • 23

tendrias que crear un boton y una estructura de div por ejemplo :

<button type="button" id="button" onclick="abrirPopup">
   Abrir popup
</button>
<div id="popup-bg">
   <div id="popup-div-principal>
     <div class="cerrar-popup" title="cerrar el popup" onclick="cerrarPopup()">
        <p>X</p>
     </div>
   </div>
</div>

el primer div seria el fondo, osea le podes poner que sea negro semitrasparente para opacar el resto del contenido y sobretodo debe tener el display: none; y position: absolute; para que no se vea de entrada y para que puedas jugar con el top, botton, right y left para darle la posicion.

lo que falta ahora es hacerlo aparecer cuando le das click al boton y eso se hace de la siguiente manera :

 //JavaScript puro
 //agarramos el div de fondo 
 var miDiv = document.getElementById("popup-bg");
 
 function abrirPopup() {
    miDiv.style.display = "block";
 }

 function cerrarPopup() {
    miDiv.style.display = "none";
 }
   

EDIT

<body>
  <table>
     <tr>
        <th>titulo</th>
        <th>titulo 2 </th>
     </tr>
     <tr>
        <td>primera linea</td>
        <td><button>editar</button></td>
     </tr>
     <div class="popup-bg">
        <div class="main-popup">
          <input type="hidden" name="id" value="<?=$inmueble[$var]['id']?>">
        </div>
     </div>
  </table>
</body>

tendrias que crear un boton y una estructura de div por ejemplo :

<button type="button" id="button" onclick="abrirPopup">
   Abrir popup
</button>
<div id="popup-bg">
   <div id="popup-div-principal>
     <div class="cerrar-popup" title="cerrar el popup" onclick="cerrarPopup()">
        <p>X</p>
     </div>
   </div>
</div>

el primer div seria el fondo, osea le podes poner que sea negro semitrasparente para opacar el resto del contenido y sobretodo debe tener el display: none; y position: absolute; para que no se vea de entrada y para que puedas jugar con el top, botton, right y left para darle la posicion.

lo que falta ahora es hacerlo aparecer cuando le das click al boton y eso se hace de la siguiente manera :

 //JavaScript puro
 //agarramos el div de fondo 
 var miDiv = document.getElementById("popup-bg");
 
 function abrirPopup() {
    miDiv.style.display = "block";
 }

 function cerrarPopup() {
    miDiv.style.display = "none";
 }
   

tendrias que crear un boton y una estructura de div por ejemplo :

<button type="button" id="button" onclick="abrirPopup">
   Abrir popup
</button>
<div id="popup-bg">
   <div id="popup-div-principal>
     <div class="cerrar-popup" title="cerrar el popup" onclick="cerrarPopup()">
        <p>X</p>
     </div>
   </div>
</div>

el primer div seria el fondo, osea le podes poner que sea negro semitrasparente para opacar el resto del contenido y sobretodo debe tener el display: none; y position: absolute; para que no se vea de entrada y para que puedas jugar con el top, botton, right y left para darle la posicion.

lo que falta ahora es hacerlo aparecer cuando le das click al boton y eso se hace de la siguiente manera :

 //JavaScript puro
 //agarramos el div de fondo 
 var miDiv = document.getElementById("popup-bg");
 
 function abrirPopup() {
    miDiv.style.display = "block";
 }

 function cerrarPopup() {
    miDiv.style.display = "none";
 }
   

EDIT

<body>
  <table>
     <tr>
        <th>titulo</th>
        <th>titulo 2 </th>
     </tr>
     <tr>
        <td>primera linea</td>
        <td><button>editar</button></td>
     </tr>
     <div class="popup-bg">
        <div class="main-popup">
          <input type="hidden" name="id" value="<?=$inmueble[$var]['id']?>">
        </div>
     </div>
  </table>
</body>

Origen Enlace
Federico
  • 1.5k
  • 12
  • 23

tendrias que crear un boton y una estructura de div por ejemplo :

<button type="button" id="button" onclick="abrirPopup">
   Abrir popup
</button>
<div id="popup-bg">
   <div id="popup-div-principal>
     <div class="cerrar-popup" title="cerrar el popup" onclick="cerrarPopup()">
        <p>X</p>
     </div>
   </div>
</div>

el primer div seria el fondo, osea le podes poner que sea negro semitrasparente para opacar el resto del contenido y sobretodo debe tener el display: none; y position: absolute; para que no se vea de entrada y para que puedas jugar con el top, botton, right y left para darle la posicion.

lo que falta ahora es hacerlo aparecer cuando le das click al boton y eso se hace de la siguiente manera :

 //JavaScript puro
 //agarramos el div de fondo 
 var miDiv = document.getElementById("popup-bg");
 
 function abrirPopup() {
    miDiv.style.display = "block";
 }

 function cerrarPopup() {
    miDiv.style.display = "none";
 }