从选择框显示数据而无需单击按钮

时间:2019-09-22 15:29:55

标签: javascript php ajax

我已经完成了这项工作,但是不知何故它停止了工作。我想在不单击按钮的情况下显示与选择框中选择的数据相关的数据库信息,所以我使用了ajax。

按钮“批准间隙”用于显示数据后希望使用的另一种操作。

有一个ID为#records的div,它已隐藏,并在显示数据时显示。

<div class="card-body">
  <form id="gform" action="action/actionclearance.php" method="POST">
     <label>Student ID</label>
     <select id="stud_id" name="stud_id" class="form-control col-md-6" required>
     <option selected="selected">Select Student ID</option>
     <?php
         $mysqli = new mysqli ('localhost', 'u220931635_arug', 'Smarvcdsl2019', 'u220931635_arug') or die (mysqli_error($mysqli));
         $resultset = mysqli_query($mysqli, "SELECT * FROM tbl_student where delete_flag = 0");
         while( $rows = mysqli_fetch_assoc($resultset) ) {
      ?>
      <option><?php echo $rows["stud_id"]; ?></option>
      <?php } ?>
      </select>
  <br>
  <a href="action/actionclearance.php?gclear=<?php echo $rows["stud_id"]; ?>"><button type="submit" class="btn btn-primary btn-md" name="gclear" id="gclear" class="gclear"><i class="fas fa-check-double"></i> Approve Clearance</button></a>
   </form>
</div>
<div class="card-footer">
      <div id="display">
         <div class="row" id="heading" style="display:none;">
            <tr>
            <th class="text-center">
               <div class="col-sm-6">
                   <strong>Student</strong>
               </div>
            </th>
            </tr>
         </div>
         <div class="row" id="records">
            <tr>
            <td>
               <div class="col-sm-6">
                  <span id="stud_fname"></span>&nbsp;
                  <span id="stud_mname"></span>&nbsp; 
                  <span id="stud_lname"></span>&nbsp;
                  <span id="stud_suffix"></span>&nbsp;
               </div>
             </td>
             </tr>
          </div>         
          <div class="row" id="no_records">
            <div class="col-lg-12 text-center">
                Plese select Student ID to view details</div>
            </div>
          </div>
     </div>
</div>

下面是我用来显示数据而无需单击按钮的ajax代码。

<script>
    $(document).ready(function(){
        // code to get all records from table via select box
        $("#stud_id").change(function() {
            var id = $(this).find(":selected").val();
            var dataString = 'stud_id='+ id;

            $.ajax({
                url: 'getstudent.php',
                dataType: "json",
                data: dataString,
                cache: false,
                success: function(studentData) {
                    if(studentData) {
                    $("#heading").show();
                    $("#no_records").hide();
                    $("#stud_fname").text(studentData.stud_fname);
                    $("#stud_mname").text(studentData.stud_mname);
                    $("#stud_lname").text(studentData.stud_lname);
                    $("#stud_suffix").text(studentData.stud_suffix);
                    $("#records").show();
                    } else {
                    $("#heading").hide();
                    $("#records").hide();
                    $("#no_records").show();
                    }
                }
            });
        });
    });
</script>

这是getstudent.php,它连接到ajax获取要显示的数据的数据库。

<?php
    include("../configAdmin.php");

    if($_REQUEST['stud_id']) {
        $mysqli = new mysqli ('localhost', 'u220931635_arug', 'Smarvcdsl2019', 'u220931635_arug') or die (mysqli_error($mysqli));
        $resultset = mysqli_query($mysqli, "SELECT * FROM tbl_student where delete_flag = 0 AND stud_id ='".$_REQUEST['stud_id']."'");

            while( $rows = mysqli_fetch_assoc($resultset) ) {
                $data = $rows;
            }
            echo json_encode($data);
    } else {
        echo 0;
    }
?>

1 个答案:

答案 0 :(得分:-1)

不用ajax就可以做到

<select id="stud_id" name="stud_id" class="form-control col-md-6" required>
     <option selected="selected">Select Student ID</option>
     <?php
         $mysqli = new mysqli ('localhost', 'u220931635_arug', 'Smarvcdsl2019', 'u220931635_arug') or die (mysqli_error($mysqli));
         $resultset = mysqli_query($mysqli, "SELECT * FROM tbl_student where delete_flag = 0");
         while( $rows = mysqli_fetch_assoc($resultset) ) {
      ?>

<option value="<?php echo $rows["stud_id"]; ?>"><?php echo $rows["stud_id"]; ?></option>

      <?php } ?>
      </select>
相关问题