title: make a query select like username and trigger modal to hide - Ajax & Jquery
body: <p>How can I trigger modal hide after the ajax successfully get the data from the server. right now my problem is the modal is not closing even after I make a query on the server side, it might me my ajax calling is wrong but tried this code and it does not even work please see my code below.</p>
  
  <p>here is the value</p>
  
  <pre><code>&lt;textarea id="scanned-QR" name="search"&gt;&lt;/textarea&gt;
  </code></pre>
  
  <p>here is the modal </p>
  
  <pre><code>    &lt;!-- Modal --&gt;
  &lt;div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLongTitle" aria-hidden="true"&gt;
    &lt;div class="modal-dialog" role="document"&gt;
      &lt;div class="modal-content"&gt;
        &lt;div class="modal-header"&gt;
        &lt;/div&gt;
        &lt;div class="modal-body"&gt;
          ...
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>here is the var value that I fetch from the textarea value</p>
  
  <pre><code>var query = $('#scanned-QR').val();
      fetch_customer_data(query);
  
  
  $(document).on('keyup', '#scanned-QR', function(){
        var query = $(this).val();
        fetch_customer_data(query);
      });
  </code></pre>
  
  <p>and here is my ajax call </p>
  
  <pre><code>    function fetch_customer_data(query = '') 
      {
  
        $.ajax({
          url:"select.php",
          method: 'GET',
          data:{query:query},
          dataType: 'json',
          success:function(data) {
              $("#exampleModal").removeClass("in");
              $(".modal-backdrop").remove();
              $('body').removeClass('modal-open');
              $('body').css('padding-right', '');
              $("#exampleModal").hide();
          },
          error:function(err){
              console.log(err);
          }
        });
      }
  </code></pre>
  
  <p><strong>so the output is :</strong> after I <code>keyup</code> then the textarea value will compare to the database value if it is <code>LIKE</code> or the same value, then if it is the same value. success ajax must execute the following lines. </p>
  
  <p>lastly, my database connect and my select query </p>
  
  <p><strong>select.php</strong></p>
  
  <pre><code>&lt;?php
    ini_set('display_errors', 1);
    ini_set('display_startup_errors', 1);
    error_reporting(E_ALL);
  
    $link = mysqli_connect("localhost","root","");
    mysqli_select_db($link, "test");
  
    $query = $_GET['query'];
  
    $res = mysqli_query($link,"SELECT * FROM admin WHERE username LIKE '$admin%' ");
  
    ?&gt;
  </code></pre>