Question

我想在php中满足某些条件时显示bootstrap 3模态（不使用onclick按钮）。我是php的新手。我想显示一个引导模式，如果该书返回罚款。我是php bootstrap 3的新手，我真的很困惑这个问题。 php代码： -

<?php
$date = mysqli_real_escape_string($conn, trim('now()'));
if (isset($_POST['return'])) {
    try {
        //--- start if else
        if (isset($_POST['acc_no']) && !empty($_POST['acc_no'])) {
            $acc_no = mysqli_real_escape_string($conn, trim($_POST['acc_no']));
            //echo "$acc_no";
        } else {
            throw new Exception('<p class="notice">Please Enter an Accession Number.</p>');
        }
        //-----end of if else

        $sql = "SELECT * FROM `issue_tbl` WHERE `acc_no`='$acc_no' AND /*`member_no`='$member_no' AND*/ `issue_return_status`='issued'";
        $res = mysqli_query($conn, $sql);
        if (mysqli_num_rows($res) < 1) {
            throw new Exception('<p class="notice">No Book Issue found for this Accession Number.</p>');
        } else {
            $row          = mysqli_fetch_assoc($res);
            $title        = $row['title'];
            $acc_no       = $row['acc_no'];
            $issue_date   = $row['issue_date'];
            $cover_img    = $row['cover_img'];
            $author       = $row['author'];
            //no of days ,weeks
            $issue_on     = strtotime($issue_date);
            $current_date = time();
            $no_of_days   = $current_date - $issue_on;
            $no_of_days   = round($no_of_days / (60 * 60 * 24));
            $weeks        = $no_of_days / 7;
            //$weeks= round($weeks);
            $total_fine   = $weeks * 5;
            $total_fine   = round($total_fine, 2);
            //$total_fine=round($total_fine);
            if ($no_of_days <= 7) {
                $due_status = '<h1 class="label label-success">No Due</h1>';
                $total_fine = '0.00';
                $sql        = "UPDATE `issue_tbl` SET `issue_return_status`='return',`return_date`=$date WHERE `acc_no`='$acc_no' AND /* `member_no`='$member_no' AND */ `issue_return_status`='issued'";
                $res        = mysqli_query($conn, $sql);
                if (!$res) {
                    throw new Exception('<p class="notice">Failed to Return Book.</p>');
                } else {
                    $acc_update_sql = "UPDATE `acc_reg` SET `available`='true' WHERE `acc_no`= '$acc_no' AND `available`='false'";
                    if (mysqli_query($conn, $acc_update_sql)) {
                        echo '<p class="notice-success">Book Returned Successfully.</p>';
                    } else {
                        throw new Exception(mysqli_error($conn));
                    }
                }
                // throw new Exception($due_status);
            } else {
                $due_status = ' <h1 class="label label-danger"> Fine Due</h1>';
                // I want to display Bootstrap modal in this section just like i am using javascript alert in the below...

                // -------------------------------------- I want do this without modal button-------------------
                // <!-- Button trigger modal -->
                // echo' <button type="button" class="btn btn-primary btn-sm" data-toggle="modal" data-target="#myModal">
                //                                Launch demo modal
                //                                </button>';
                // -------------------------------------- I want do this without modal button-------------------
                echo '<script language="javascript">';
                echo 'alert("message successfully sent")';
                echo '</script>';
                throw new Exception($due_status);
            }

        }

    }
    catch (Exception $e) { //end of try block
        echo $e->getMessage();
    } //end of catch block
} //end of Isset post issue
?>

模态： -

<div id="myModal" class="modal fade" role="dialog">
  <div class="modal-dialog">
    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">Modal Header</h4>
      </div>
      <div class="modal-body">
        <p>Some text in the modal.</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>

  </div>
</div>

请有人帮助我。对不起，我的英语不好。它不是我的第一语言。提前谢谢

Answer 1

因为您刚刚开始，我决定在您的问题下为我的评论添加一些细节并将其转换为答案，为您提供更详细的解释，希望您（以及其他未来的用户）可能会发现它有用。这是我的原始评论，其中概述了原则： php 是服务器端而 JavaScript 是客户端：< / p>

除了@ju_指出的内容之外，您还需要了解以下原则：在页面被“烘焙”时（在服务器端）执行php。当页面完成并且已经提供给浏览器（客户端）时，Bootstrap通过JavaScript打开。如果您的条件为真（在php中），您需要在页面HTML标记（如data-*属性）中放置一些内容，您可以在页面到达浏览器后通过JavaScript进行检查。如果您传递的元素/属性为true，请以编程方式打开模态。

了解php代码的逻辑与此无关。我将简单地假设您将条件的真实性放在名为$isConditionTrue的php中的变量中。在php：

if ($isConditionTrue) {
    echo '<div style="display:none" data-condition></div>'
}

这将在您的标记中放置一个具有data-condition属性的隐藏div。

在JavaScript中（我将使用jQuery，因为它已经为Bootstrap加载了）：

if ($("[data-condition]").is("[data-condition]")) {
    $('#yourModal').modal('show');
}

注意：不要忘记调整打开模态的代码，使用适用于特定模态的模式。另请注意，data-condition是一个非常通用的属性，您可能希望使用更具体的属性（因此不太可能与其他现有自定义属性冲突，即：data-bookfine或data-myfinebook等...）

该条件基本上会检查您网页中是否有data-condition属性的元素。上面的解决方案假设您只将此技术与一个元素一起使用。如果您计划多次使用它，您可能希望将值添加到data-condition或者可能为隐藏元素添加类和ID，并调整JavaScript if()以使逻辑对每个案例都正常工作并且不影响其他情况。

另一个注意事项：您不仅限于data-*属性，而且这是将自定义逻辑添加到标记的常用方法。它也可以通过jQuery中的.data()方法轻松访问，当你有集合时特别有用，所以很多人都使用它。但您可以使用任何有效的HTML标记。例如，自定义标记：

<book-fine></book-file>

但不要忘记在CSS中使用book-fine{display:none}并将JS更改为：

if ($('book-fine').is('book-fine')) { 
  // open modal
}

如果条件满足，则在php时调用bootstrap模式

1 个答案: