首页 > 解决方案 > 将 GET 变量传递给 Modal 以在查询中使用

问题描述

我正在尝试构建预算查找工具。我有表格,有人输入帐户#、基金# 和部门 ID#。当他们点击搜索时,它会打开一个模式并显示与输入的基金、帐户和部门 ID 匹配的预算余额表。

我可以打开模式,但是我似乎无法将数据传递给模式并根据 SQL 查询显示数据。这是我的代码:

这是表格:

<form method="GET" id="frm" name="frm">
<div class="row">
    <div class="col mb-2">
    <label for="account">Account:</label>
   <select class="form-control" name="account2" id="account2" required>
      <option></option>
     <?php
while(!$accounts->atEnd()) { //dyn select
?>
                <option value="<?php echo($accounts->getColumnVal("account")); ?>"><?php echo($accounts->getColumnVal("account")); ?>: <?php echo($accounts->getColumnVal("description")); ?></option>
                <?php
  $accounts->moveNext();
} //dyn select
$accounts->moveFirst();
?>
      </select>
    </div>
    <div class="col mb-2">
    <label for="fund">Fund:</label>
     <select class="form-control" name="fund2" id="fund2" required>
      <option></option>
     <?php
while(!$funds->atEnd()) { //dyn select
?>
                <option value="<?php echo($funds->getColumnVal("fundID")); ?>"><?php echo($funds->getColumnVal("fundID")); ?>: <?php echo($funds->getColumnVal("fund")); ?></option>
                <?php
  $funds->moveNext();
} //dyn select
$funds->moveFirst();
?>
      </select>
    </div>
  </div>
<div class="row">
    <div class="col mb-2"> 
            <label for="fund">Department ID#:</label>
             <input type="text" name="funding_department2" id="funding_department2" class="form-control input-md" autocomplete="off" value="" required>
    </div></div>
<button type="submit" name="submit2" id="submit2" class="btn-lg btn-info">Search</button>   
    </form>

这是脚本和模态:

<script>
    $(document).ready(function() {
  $('#frm').on('submit2', function(e){
      $('#myLargeModalLabel').modal('show');
      e.preventDefault();
  });
});
</script>
   <!-- Large modal -->
<div class="modal fade bd-example-modal-lg" tabindex="-1" id="myLargeModalLabel" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-lg">
    <div class="modal-content p-4">
     <h4 class="modal-title">Budget Summary</h4>For Account: <?php echo $_GET['account2']; ?>, Fund: <?php echo $fund; ?>, DeptID#: <?php echo $deptID; ?><br><em>The budgeted balance is an estimate.</em></h4>
      <br>  <?php if ($budget_summary->TotalRows == 0) { // Show if mysqli recordset empty ?>There is no data. Please try your search again.<?php } ?>
        <?php if ($budget_summary->TotalRows > 0) { // Show if mysqli recordset empty ?><table width="100%" class="table table-responsive" border="0" cellspacing="2" cellpadding="6" class="display" id="example2">
            <thead>
              <tr>
                <th align="left" valign="top">Budgeted Amount</th>
                 <th align="left" valign="top">Budgeted Balance</th>
                 <th align="left" valign="top">Program</th>
                </tr>
            </thead>
            <tbody>
              <?php
while(!$budget_summary->atEnd()) {
?><tr>
<td valign="top">$<?php echo($budget_summary->getColumnVal("budgeted_amount")); ?></td>
<td valign="top">$<?php echo($budget_summary->getColumnVal("budgeted_balance")); ?></td>
<td valign="top"><?php echo($budget_summary->getColumnVal("program")); ?></td>
                  </tr>
                <?php
  $budget_summary->moveNext();
}
$budget_summary->moveFirst(); //return RS to first record
?>
            </tbody>
          </table><?php } ?>
          <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>

这是 SQL 查询:

<?php
$fund = mysqli_real_escape_string($sa, $_GET["fund2"]);
$account = mysqli_real_escape_string($sa, $_GET["account2"]);
$deptID = mysqli_real_escape_string($sa, $_GET["funding_department2"]);
$budget_summary = new WA_MySQLi_RS("budget_summary",$sa,0);
$budget_summary->setQuery("SELECT * from budget_summary where fund = ? and account = ? and deptID = ?");
$budget_summary->bindParam("i", "".$fund ."", "-1"); //colname
$budget_summary->bindParam("i", "".$account ."", "-1"); //colname2
$budget_summary->bindParam("i", "".$funding_department ."", "-1"); //colname3
$budget_summary->execute();
?>

标签: phpsqlformsmodal-dialog

解决方案


你的事情不顺。选择/提交按钮应触发后端操作以从数据库中检索数据(通过 ajax 请求),然后将数据作为 JSON 返回到您的页面,您可以在 javascript 中将其解析为 HTML-或-而不是返回 JSON 数据,您可以返回模态的 HTML。也许是这样的

$(document).ready(function() {
  $('#frm').submit(function(e){
     // gather your inputs 
      var url="backend-php.php";
      $.ajax({
        url: url, // your back-end PHP script, will return the HTML needed
        method: 'GET',
        data : {
           account2: $('#account2').val(),
           fund2: $('#fund2').val(),
           funding_department2: $('#funding_department2').val(),
        },
        success: function(result){
           $('#myLargeModalLabelHTML').html(result)         
           $('#myLargeModalLabel').modal('show');
        }
     })
      e.preventDefault();
  });
});

您的 MOdal HTML 可能会变成:

<!-- Large modal -->
<div class="modal fade bd-example-modal-lg" tabindex="-1" id="myLargeModalLabel" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-lg">
    <div class="modal-content p-4" id="myLargeModalLabelHTML">
     <!-- everything will go in here -->
    </div>
    <div class="modal-footer"><button type="button" class="btn btn-default" data-dismiss="modal">Close</button></div>
  </div>
</div>

和您的 PHP 脚本,例如:

<?php

function getModalHtml() {
$budget_summary = new WA_MySQLi_RS("budget_summary",$sa,0);
$budget_summary->setQuery("SELECT * from budget_summary where fund = ? and account = ? and deptID = ?");
$budget_summary->bindParam("i", $_GET["fund2"], "-1"); //colname
$budget_summary->bindParam("i", $_GET["account2"], "-1"); //colname2
$budget_summary->bindParam("i", $_GET["funding_department2"], "-1"); //colname3
$budget_summary->execute();
?>

<h4 class="modal-title">Budget Summary</h4>For Account: <?php echo $_GET['account2']; ?>, Fund: <?php echo $fund; ?>, DeptID#: <?php echo $deptID; ?><br><em>The budgeted balance is an estimate.</em></h4>
          <br>  <?php if ($budget_summary->TotalRows == 0) { // Show if mysqli recordset empty ?>There is no data. Please try your search again.<?php } ?>
            <?php if ($budget_summary->TotalRows > 0) { // Show if mysqli recordset empty ?><table width="100%" class="table table-responsive" border="0" cellspacing="2" cellpadding="6" class="display" id="example2">
                <thead>
                  <tr>
                    <th align="left" valign="top">Budgeted Amount</th>
                     <th align="left" valign="top">Budgeted Balance</th>
                     <th align="left" valign="top">Program</th>
                    </tr>
                </thead>
                <tbody>
                  <?php
    while(!$budget_summary->atEnd()) {
    ?><tr>
    <td valign="top">$<?php echo($budget_summary->getColumnVal("budgeted_amount")); ?></td>
    <td valign="top">$<?php echo($budget_summary->getColumnVal("budgeted_balance")); ?></td>
    <td valign="top"><?php echo($budget_summary->getColumnVal("program")); ?></td>
                      </tr>
                    <?php
      $budget_summary->moveNext();
    }
    $budget_summary->moveFirst(); //return RS to first record
    ?>
                </tbody>
              </table><?php } ?>
             

          <?php }?>

推荐阅读