title: Get a variable from PHP into a Fancybox
body: <p>Apologies if this is a duplicate; I've researched the similar questions but am unable to get anything to work (I'm very new to PHP and JQuery).</p>
  
  <p>I so far have this function set up, which pulls the values for id and tip like I want them to:</p>
  
  <pre><code>$(document).ready(function(){
      $('.tooltip').click(function(){
          var id      = $(this).attr('tooltip-id');
          var tip     = $(this).attr('data-tooltip');
          var target  = $('div#tooltip-modal');
          $.fancybox(target);
  
      });
  </code></pre>
  
  <p>Here is the relevant div:</p>
  
  <pre><code>&lt;div id="tooltip-modal" style="display:none"&gt;
      &lt;h2&gt;Edit the description of this item:&lt;/h2&gt;
      &lt;form id="update-tooltip"&gt;
          &lt;input type="hidden" id="id" value="id"&gt;
          Tooltip body: &lt;textarea name="body" class="input"&gt;{{tip}}&lt;/textarea&gt;&lt;br&gt;
          &lt;input type="submit" value="Update" id="update"&gt;
      &lt;/form&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I want the values for tip and id to show up in their respective destinations (id is hidden, tip should be the body of a textarea that will hopefully be editable by the user).  I feel like this should be simple, no?  I've tried every method of passing it in; I see people have recommended AJAX, but I'm new to that too and fairly certain I did it wrong (if that's even the right way to go).</p>
  
  <p>I eventually will need to save the modified tip text to a database, but that's a problem for another day.  If that influences your solution, though, now you know.</p>