Question

是否可以根据用户选择从引导模式查询MySQL数据库，并在没有模态关闭的同一模态下获取db结果？这是我模态中2个下拉列表的示例。

<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
      }
    });
  });
});

在引导模式

1 个答案: