title: JQuery open popup window and return value from clicked link
body: <p>I'm wanting to open a pop up window using JQuery to display a selection of images. The images are wrapped in link tags in an unordered list. There will be some navigation added at some point so I don't think a dialog is appropriate. Here is the code I have so far:</p>
  
  <p>Main Page:</p>
  
  <pre><code>&lt;script&gt;
      $('.ImageManager').click(function (event) {
          event.preventDefault();
          window.open($(this).attr("href"), "popupWindow", "width=600, height=400, scrollbars=yes");
      });
  &lt;/script&gt;
  
  
  &lt;a href="/image-manager" class="ImageManager"&gt;Add Image&lt;/a&gt;&lt;br /&gt;
  &lt;ul id="imagelist"&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>Popup window:</p>
  
  <pre><code>&lt;script&gt;
      $(function() {
          $(".addimage").click(function() {
              $("#imagelist", opener.document).append("&lt;li&gt;&lt;/li&gt;");
              return false;
          });
      });
  &lt;/script&gt;
  
  
  &lt;ul&gt;
  % for image in images:
  &lt;li&gt;&lt;a href="" class="addimage"&gt;&lt;img src="/static/images/{{ image }}" alt="" /&gt;&lt;/a&gt;&lt;/li&gt;
  % end
  &lt;/ul&gt;
  </code></pre>
  
  <p>The first problem I have is that the popup doesn't open, it just opens the image manager in the current browser window. I've got JQuery referenced in the head section of both pages and it works with other JQuery code.</p>
  
  <p>Secondly, I tried using plain Javascript to open the popup which worked but I couldn't get the clicked image link to append the image filename to the opener window and the popup wouldn't close afterwards.</p>
  
  <p>If I can get the popup working how do I pass the {{ image }} variable (Python Bottle template variable) passed when the image in the popup is clicked?</p>