title: Ajax Popup on Select Box Click
body: <p>I have created a ajax popup on list view using JavaScript, check below img :</p>
  
  <p><strong>Please note that this is LIST VIEW &amp; NOT SELECT BOX</strong></p>
  
  <p><img src="https://i.stack.imgur.com/7W95E.jpg" alt="Img 01"></p>
  
  <p>On click of any product i have used Ajax Pop up which is also working properly, check below image :
  <img src="https://i.stack.imgur.com/s108f.jpg" alt="enter image description here"></p>
  
  <hr>
  
  <p>Now my major using is that i wanna use SELECT BOX instead of LIST VIEW, so how can i pass a value after selection option from list view and pass it to AJAX MODAL</p>
  
  <hr>
  
  <p><strong>My CODE :</strong></p>
  
  <pre><code>&lt;ul class="no-js" style="margin: 0px; float: left;"&gt;
      &lt;li&gt;&lt;b&gt;Product Selection : &lt;/b&gt; &lt;a class="clicker" id="select"&gt;Add Item...&lt;/a&gt;
          &lt;ul style="max-height:200px; overflow:auto;"&gt;
              &lt;li id="animation-switcher"&gt;&lt;a href="#selectPro" class="proModal" data-id="1~2"&gt;Product 01 &lt;/a&gt;&lt;/li&gt;
              &lt;li id="animation-switcher"&gt;&lt;a href="#selectPro" class="proModal" data-id="2~2"&gt;Product 02&lt;/a&gt;&lt;/li&gt;
              &lt;li id="animation-switcher"&gt;&lt;a href="#selectPro" class="proModal" data-id="3~2"&gt;Product 03&lt;/a&gt;&lt;/li&gt;
                  &lt;/ul&gt;
      &lt;/li&gt;
      &lt;/ul&gt;
  </code></pre>
  
  <p><strong>MY AJAX CODE :</strong></p>
  
  <pre><code>$('a.proModal').click(function(){
                  var qid = $(this).attr('data-id');
                  $.ajax({
                      type: "POST",
                      url: "phpajaxfile.php", // 
                      data: 'ProSelectid='+qid,
                      success: function(msg){
                          $(".selectForm").html(msg);
                          //$.magnificPopup.close();
                      },
                      error: function(){
                          alert("failure");
                          $.magnificPopup.close();
                      }
                  });
  
              });
  </code></pre>
  
  <hr>
  
  <p>I want to replace ul li with select box and pass the value to ajax file..??</p>