Databases
StackOverflow2013
Postsdbo
PO
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>The easiest solution would be to use the <a href="http://api.jquery.com/load/" rel="nofollow">.load</a> method of jQuery.</p> <p>You will need to specify, e.g., a php file that will return html. Replace your <code>$.get</code> code with the following:</p> <pre><code> $('.popupcontent').load('popup.php', {id: &lt;your_id_here}); </code></pre> <p>One thing to note here: due to the fact that you are adding a parameters object here as the second parameter to <code>.load</code>, jQuery will use the POST method; therefore, in your php file, you need to change from <code>$_GET</code> to <code>$_POST</code>.</p> <p>If you want to keep using the GET method, then change the above code to the following:</p> <pre><code> $('.popupcontent').load('popup.php?id=id1'); </code></pre> <p>I would recommend giving the popup content div an id, rather than class in this case. You are dealing with a unique item. I'm referring to your current HTML, you should change it to the following:</p> <pre><code> &lt;div class="popup" id="97-box" style="top:158px;left:220px;"&gt; &lt;h3&gt;97&lt;/h3&gt; &lt;div id="popupcontent"&gt; &lt;!-- RETURNED TABLE FROM PHP FILE WILL GO HERE --&gt; &lt;/div&gt; &lt;a class="close" href="javascript:void(0)"&gt;Close&lt;/a&gt; &lt;/div&gt; </code></pre> <p>If you are planning on having a number of popups that share this behavior, then what you can do is this instead:</p> <pre><code> &lt;-- HTML FILE --&gt; &lt;div class="popup" id="97-box" style="top:158px;left:220px;"&gt; &lt;h3&gt;97&lt;/h3&gt; &lt;div class="popupcontent"&gt; &lt;!-- RETURNED TABLE FROM PHP FILE WILL GO HERE --&gt; &lt;/div&gt; &lt;a class="close" href="javascript:void(0)"&gt;Close&lt;/a&gt; &lt;/div&gt; // javascript file $('#97-box .popupcontent').load('popup.php', {id: &lt;your_id_here&gt;}); </code></pre> <p>The above pattern allows you to make popupcontent a generic class that can be used by other popups. The caveat is to add a different selector in your jQuery selector. In this case, I suggested <code>$('#97-box .popupcontent')</code> which will select the popupcontent div only under the html element with id: 97-box. In this case, that is your popup window.</p>
    singulars
    1. This table or related slice is empty.
    1. POJavaScript to PHP for Popup Window Content
      singulars
      1. PTQuestion
    1. PTAnswer
    1. USRyan
    1. USRyan
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. POJavaScript to PHP for Popup Window Content
      singulars
      1. PTQuestion
    1. This table or related slice is empty.
    1. VO
      singulars
      1. PO
      1. This table or related slice is empty.
      1. VTUpMod
    2. VO
      singulars
      1. PO
      1. This table or related slice is empty.
      1. VTUpMod
    3. VO
      singulars
      1. PO
      1. This table or related slice is empty.
      1. VTUpMod
    1. COAwesome. Thank you so much for your time and help. This got the content in there. Any idea how to properly reference the id at the top of the PHP file? This is not working: $id=$_GET["id"];
      singulars
      1. PO
      1. USJonathan Tonge
    2. COYou can add a params object as the second argument to `.load`. I will update my answer with an example of that.
      singulars
      1. PO
      1. USRyan
    3. COIf it works, can you upvote me and accept the answer? ;)
      singulars
      1. PO
      1. USRyan
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload