¿Rellenar contenido modal utilizando PHP y AJAX?

Quiero que el usuario pueda hacer clic en una tabla y, dependiendo de la fila en la que haga clic, llenará el modal con el contenido relacionado con esa fila (una consulta MYSQL) y abrirá el modal.

Intenté hacer esto de la siguiente manera: – Cargar contenido de la tabla – Escuchar cuando se hace clic en la tabla usando jQuery – Usar AJAX para publicar en el archivo PHP con la información de la fila en la que se hizo clic – Ejecutar consulta MYSQL usando la información de la fila – Rellenar El modal con el contenido recogido – Apertura del modal.

El problema que encontré es que debido a que es una statement MYSQL y la función no es de locking, las variables no se han declarado en el momento en que el modal comenzó a abrirse. La progtwigción web no es exactamente mi fuerte, así que estoy seguro de que me estoy perdiendo algo simple.

¡Gracias por adelantado!

EDITAR:

jQuery / AJAX

$('#alerts tbody').delegate('tr', 'click', function() { var id = $('td:eq(0)', this).text(); // Gets the ID of the row // PHP Method (below) // Passes ID through to PHP $.ajax({ url: "alerts.php", method: "GET", data: {id: ID}, async: true, done: function() { loadModalFunction(); } }); }); 

PHP

  

Modal

 $('#info').find('.modal-title').text("Information (#" + id + ")"); $('#info').find('#modal-body-content').text(""); 

Sé que la obtención de la ID y la obtención del contenido funcionan, pero el contenido no se pasa a la ID, ya que el modal se carga antes de que el script inicialice las variables globales.

Muy bien, aquí está mi implementación sobre este problema, será un poco más simple simplemente proporcionar los conceptos básicos y permitirle editar su propio código en consecuencia.

En primer lugar, todo mi contenido modal es un div con un id,

Entonces, supongamos que este botón debería abrir y llenar mi modal con datos

 Open 

openModal () se verá algo como esto

 $.post("alerts.php", { id: ID }, function(data) {//data will contain whatever alerts.php prints document.getElementById("modalcontent").innerHTML = data;//insert data into modal $('#my-modal').modal('toggle');//open modal }); 

De nuevo, hay muchas maneras de hacer esto. Hay mejores maneras de hacer esto. Pero debes entender cómo funciona algo como esto, solo puedes obtener la salida del archivo PHP en javascript y editar tu contenido con javascript. Puede obtener sus datos de otro script PHP, que será ejecutado por javascript cada vez que lo necesite, pero el propio script PHP no puede modificar el contenido de su página ya cargada.

El uso de este código y el supuesto de alerts.php hará echo "you have a notification"; ,

cambiará a

you have a notification

y luego se cambiará el modal. Este método también garantiza que el modal solo se abra después de recuperar los datos, por lo que es imposible que el modal se abra sin los datos que contiene.