Popup - open form, submit data and return selected values
<p>I've install bPopup and have a simple popup configured on my <code>main.php</code> page:</p>

<pre><code>  $('#element_to_pop_up').bPopup({
              contentContainer:'.content', 
              loadUrl: 'test.php', 
              onClose: function(){ 
                  var name = $('#name').val();
                  console.log(name)
              }
  });
</code></pre>

<p>When the button is pressed <code>#element_to_pop_up</code> is shown and <code>test.php</code> is loaded. <code>test.php</code> contains:</p>

<pre><code>SITE&lt;br/&gt;
NAME &lt;input type='text' id='name' name='name' value=''&gt;&lt;br/&gt;
ID &lt;input type='text' id='idd' name='idd' value=''&gt;&lt;br/&gt;
DESC &lt;input type='text' id='desc' name='desc' value=''&gt;&lt;br/&gt;
&lt;input type='submit' class="b-close" /&gt;
</code></pre>

<p>When the close button is pressed the popup closes and my console.log does show the value from <code>name</code></p>

<p>What I'd like to do is have is</p>

<ol>
<li><p>a <code>close</code> button that closes the popup <strong>without</strong> passing the values back</p></li>
<li><p>a separate submit button that submits the form to a database, closes the popup and returns the 3 values to the parents OnClose function.</p></li>
</ol>

<p>I've created a <a href="http://codepen.io/anon/pen/vKzvQm" rel="nofollow">codePen</a> that shows the code so far.</p>

<p>Any one any idea how I can do this ?</p>

<p>Thanks</p>

<p>I am happy to consider a different plugin if that helps..</p>