javascript - 单击另一个按钮时,一个按钮将被禁用

标签 javascript jquery html

我对编码完全陌生,我的 friend 建议我学习 php,所以他给了我一个我应该尝试的小项目,那就是一个员工门户。我被一件事困住了。

我需要一个接受拒绝按钮,当我单击批准按钮时,应禁用拒绝按钮,并且按钮中的值应在数据库中自动更新,反之亦然。另一件事是,当我单击拒绝按钮时,应弹出一个注释框,并且输入的值应添加到数据库中

<!DOCTYPE html>
    <html>
    <head>
    <title></title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    </head>
    <body>
    <?php
    include'nav.php';

    $servername = "127.0.0.1";
    $username = "root";
    $password = "";
    $dbname = "";

    $conn = new mysqli($servername, $username, $password, $dbname);


    if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
    }


    $sql=mysqli_query($conn, "SELECT user, leavetype, date, date1, numb, comment FROM lms");
    /*$result= $conn->query($sql);*/

    if ($sql) {
    if ($sql->num_rows > 1) {
    echo "<table class='table table-hover'><tr><td>User</td><td>Leave type</td><td>From date</td><td>To date</td><td>Number of days</td><td>Reason for leave</td><td></tr>";      
    while( $row=mysqli_fetch_array($sql)) 
    {
    echo "<tr><td id='rowhead'>$row[0]</td><td>$row[1]</td><td>$row[2]</td><td>$row[3]</td><td>$row[4]</td><td>$row[5]</td><td><button type='button' class='btn btn-success'>Approve</button> | <button type='button' class='btn btn-danger'>Rejected</button></td></tr>";
    }
      echo'</table>';
    }
    else {
    echo "<br> No Record Found to display";
    }
    }
    else {
    echo "<br> Database error.";
    }
    $conn->close();
    ?>

    </body>
    </html>

最佳答案

在您的代码中,您可以遵循简单的方法:

<button type='button' class='btn btn-success' id="accept" onClick="document.getElementById('reject').setAttribute('disabled',true);">Approve</button> | <button type='button' class='btn btn-danger' id="reject" onClick="document.getElementById('accept').setAttribute('disabled',true);">Rejected</button>

我们在这里所做的是:

为每个名为“接受”和“拒绝”的按钮分配一个 ID。

单击一个按钮后,我们禁用了另一个按钮:

要禁用的 JS 代码如下,当使用 onclick 处理程序单击按钮时调用该 id:

document.getElementById('THE_ID').setAttribute('disabled',true);

关于javascript - 单击另一个按钮时,一个按钮将被禁用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43247773/

相关文章:

javascript - 使用 JavaScript 获取 CSS 声明

jquery - 有两个奇怪大小的元素是中心和边缘响应想象容器

javascript - jQuery/正则表达式 : remove Div with nested Divs from TD

java - 使用 HTML 5 和 servlet 的视频

javascript - THREE.js 如何停止 chop 由 2D Canvas 制成的纹理中的文本

javascript - 无法将json数据添加到pyjade中的数据属性

java - 将 Html String 内容转换为 java Map

javascript - 未捕获的 TypeError 无法设置 null 的属性 'src'

javascript - 单个页面上有多个 Google map ?

javascript - 从图 block 服务器返回的 map 不完整,缩放级别可用的图 block 数量比文档指示的要多