從引導模式中查詢和獲取數據庫結果

Question

是否可以從引導模式查詢MySQL數據庫，基於用戶選擇並在沒有模式關閉的情況下獲取相同模式的數據庫結果？以下是我的模式中的兩個下拉菜單的示例。

<div class="tab-pane" id="relevance"> 
       <form> 
        <fieldset> 
        <div class="controls controls-row"> 
         <select class="span6"> 
          <option value="">Volume 1</option> 
          <option value="">Volume 2</option> 
         </select> 


         <select class="span6"> 
          <option value="">Number 1</option> 
          <option value="">Number 2</option> 
          <option value="">Number 3</option> 
          <option value="">Number 4</option> 
          <option value="">Number 5</option> 
          <option value="">Number 6</option> 
          <option value="">Number 7</option> 
          <option value="">Number 8</option> 

         </select> 
        </div><br> 
        <button type="submit" class="btn btn-warning">Sort</button> 
        </fieldset> 
       </form> 
      </div> 

當用戶點擊搜索按鈕時，它應該查詢並顯示結果，而不用模態結束。我可以處理php和SQL語句，我只是不知道如何去做。

Answer 1

您可以創建一個AJAX調用來將表單提交到後端以獲取數據。 添加ID到您的按鈕，即可輕鬆識別它

<button type="submit" class="btn btn-warning" id="filter">Sort</button>

而在JavaScript中使用jQuery來創建AJAX調用：

$(document).ready(function(){ 
    $('#filter').on('click', function(e) { 
    e.preventDefault(); 
    var url = 'path/to/php/script'; 
    var filterData = {}; //values you need to submit from the filter form 
    $.ajax({ 
     type: "POST", 
     url: url, 
     data: filterData, 
     success: function(data) { 
     // use data fetched to write it inside the DOM 
     } 
    }); 
    }); 
});