Databases
StackOverflow2013
Postsdbo
PO
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>The tutorial is a good start on a solution, but does not quite provide all of the details. There are also some changes that I would make. Here is what I would do to get it working:</p> <ul> <li>Create the Ajax Handler template and page</li> <li>Make sure the link you want to use to open the modal includes the <code>postpopup</code> class and has the post ID in the <code>rel</code> attribute.</li> <li>Create a <code>js/</code> folder in your theme directory</li> <li>Download <a href="http://code.google.com/p/simplemodal/downloads/detail?name=jquery.simplemodal.1.4.1.min.js" rel="nofollow">SimpleModal 1.4.1</a> and place the file in the <code>js/</code> folder</li> <li>Create a custom JavaScript file (<code>site.js</code>) and place it in the <code>js/</code> folder</li> <li>Put the following code in <code>site.js</code>: </li> </ul> <p>.</p> <pre><code>jQuery(function ($) { $('a.postpopup').click(function(){ id = this.rel; $.get('http://yourdomain.com/ajax-handler/?id='+id, function (resp) { var data = $('&lt;div id="ajax-popup"&gt;&lt;/div&gt;').append(resp); // remove modal options if not needed data.modal({ overlayCss:{backgroundColor:'#000'}, containerCss:{backgroundColor:'#fff', border:'1px solid #ccc'} }); }); return false; }); }); </code></pre> <ul> <li>Add the following code to your theme's <code>functions.php</code> file:</li> </ul> <p>.</p> <pre><code>function my_print_scripts() { if (!is_admin()) { $url = get_bloginfo('template_url'); wp_enqueue_script('jquery-simplemodal', $url . '/js/jquery.simplemodal.1.4.1.min.js', array('jquery'), '1.4.1', true); wp_enqueue_script('my_js', $url . '/js/site.js', null, '1.0', true); } } add_action('wp_print_scripts', 'my_print_scripts'); </code></pre> <hr> <p>That should get it working for you. Make sure you have the <code>wp_footer()</code> function in your theme's footer. I re-worked the way the modal window was being called so that the auto-centering of the content works.</p>
    singulars
    1. This table or related slice is empty.
    1. POUsing simplemodal with wordpress
      singulars
      1. PTQuestion
    1. PTAnswer
    1. This table or related slice is empty.
    1. USEric Martin
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. POUsing simplemodal with wordpress
      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. VTAcceptedByOriginator
    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. COThanks Eric, this was very helpful and I got the simplemodal working. I do have an additional question if you don't mind. I also downloaded the OSX simplemodal theme and am trying to get it to work in this scenario. Would you be able to tell me what modifications I need to make to be able to use it here?
      singulars
      1. PO
      1. USRichard
    2. COThis is amazing -- exactly what I needed. The tutorial from Wordpress Themes Collection wasn't working for me for whatever reason.
      singulars
      1. PO
      1. USDanny Cooper
 

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