douhui9380 2017-05-18 05:42
浏览 37
已采纳

我的编辑按钮在下一页上不起作用(仅在第一页上工作)

my edit and delete query only work on the first page of datatables, but not on the second page. i'm using ajax and jquery. i'm new and this is for my project in college. thanks for helping me. here's the code.

 <script>
       $(function () {
    $("#example1").DataTable();
    $('#example2').DataTable({
      "paging": true,
      "lengthChange": false,
      "searching": false,
      "ordering": true,
      "info": true,
      "autoWidth": false
    });
  });

    </script>
    
    <script type="text/javascript">
      $(document).ready(function (){
        $(".open_modal").click(function (e){
          var m = $(this).attr("id");
          $.ajax({
            url: "user_edit.php",
            type: "GET",
            data : {username: m,},
            success: function (ajaxData){
              $("#ModalEdit").html(ajaxData);
              $("#ModalEdit").modal('show',{backdrop: 'true'});
            }
          });
        });
      });
    </script>

    <script type="text/javascript">
     $(document).ready(function (){
      $(".open_delete").click(function (e){
        var m = $(this).attr("id");
        $.ajax({
          url: "user_delete.php",
          type: "GET",
          data : {username: m,},
          success: function (ajaxData){
            $("#ModalDelete").html(ajaxData);
            $("#ModalDelete").modal('show',{backdrop: 'true'});
          }
        });
      });
    });
  </script>
<button type="button" data-toggle="modal" data-target="#tambah" class="btn btn-info"><i class="glyphicon glyphicon-plus"></i> Tambah User</button>
            </br>
            </br>

            <?php include"alert.php"; ?>
            <table id="example1" class="table table-bordered table-striped" >
              <thead>
                <tr>
                  <th>Nomor</th>
                  <th>Username</th>
                  <th>Nama Lengkap</th>
                  <th>Password</th>
                  <th>Level</th>
                  <th>Nama Toko</th>
                  <th>Action</th>   
                </tr>
              </thead>

              <tbody>
              <?php 
              include "connection.php";
              $query_mysql = mysqli_query($connection,"SELECT username, password, level, nama_lengkap, status, nama_toko FROM master_user INNER JOIN master_toko ON master_user.id_toko = master_toko.id_toko where status='0'")or die(mysqli_error());

              $nomor = 1;
              while($data = mysqli_fetch_array($query_mysql)){
                ?>
                  <tr>
                    <td><?php echo $nomor++; ?></td>
                    <td><?php echo $data['username']; ?></td>
                    <td><?php echo $data['nama_lengkap']; ?></td>
                    <td><?php echo $data['password']; ?></td>
                    <td><?php echo $data['level']; ?></td>
                    <td><?php echo $data['nama_toko']; ?></td>
                    <td>
                      <a href="#" class='btn btn-primary open_modal' id='<?php echo $data['username']; ?>'><span class="glyphicon glyphicon-pencil" style="padding-right: 2px"></span>Edit</a> |
                      <a href="#" class='btn btn-danger open_delete' id='<?php echo $data['username']; ?>'><span class="glyphicon glyphicon-trash" style="padding-right: 2px"></span>Hapus</a>        
                    </td>
                  </tr>  <?php } ?>
                </tbody>
               
              </table>
            </div>
          </div>
        </div>
      </div>
    </section>
    
   <!-- FOR EDIT AND DELETE -->
    <div id="ModalEdit" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    </div>

    <div id="ModalDelete" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    </div>

and this is for edit i reference the username because username is my primary key here the code

    include "connection.php";
    $username = $_GET['username'];
    echo $username;
    $ambildata = mysqli_query($connection,"select * from master_user where username='$username'");
    
    while($row=  mysqli_fetch_array($ambildata)){
?>

<div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
              <span aria-hidden="true">&times;</span>
            </button>
            <h4 class="modal-title" id="myModalLabel">Edit User</h4>
        </div>
        <div class="modal-body">
            <form class="form-horizontal" action="proses_edituser.php" name="modal-popup" enctype="multipart/form-data" method="POST" id="form-edit">
           
                <div class="form-group">
                    <label class=" control-label col-md-3">Username</label>
                        <div class="col-md-9">
                            <input class="form-control" type="text" name="username" value="<?php echo $row['username']; ?>"/>
                            
                            <span class="help-block"></span>
                        </div>
                </div>
                            
                <div class="form-group">
                    <label class="col-md-3 control-label">Nama Lengkap</label>
                        <div class="col-md-9">
                       <input  class="form-control" type="text" name="nama_lengkap" value="<?php echo $row['nama_lengkap']; ?>"/>
                        <span class="help-block"></span>
                        </div>
                </div>
                            
                <div class="form-group">
                     <label class="col-md-3 control-label">Password</label>
                        <div class="col-md-9">
                        <input class="form-control" type="password" name="password" value="<?php echo $row['password']; ?>"/>
            </div>
                </div>

                <div class="form-group">
                    <label class="control-label col-md-3">Level</label>
                        <div class="col-md-9">
                             <select name="level" class="form-control">
                                          <option value=''>--Select--</option>
                                          <option value='owner' <?php if ($row['level']=='owner'){echo"SELECTED";}?>>Owner</option>
                                          <option value='manajer' <?php if($row['level'] == 'manajer'){ echo "SELECTED"; } ?>>Manajer</option>
                                          <option value='bendahara' <?php if($row['level'] == 'bendahara'){ echo "SELECTED"; } ?> >Bendahara</option>
                                          <option value='administrator' <?php if($row['level'] == 'administrator'){ echo "SELECTED"; } ?>>Administrator</option>
                                      </select>
                            <span class="help-block"></span>
                        </div>
                </div>

                 <div class="form-group">
                    <label class="control-label col-md-3">Toko</label>
                    <div class="col-md-9">
                      <select name="id_toko" class="form-control">
                        <option value="">-- Pilih Toko --</option>
                        <?php
                          require "connection.php";
                          $datatoko = "SELECT * FROM master_toko ORDER BY id_toko ASC";
                          $resultsql = mysqli_query($connection, $datatoko);
                          if (mysqli_num_rows($resultsql) > 0) {
                            while ($row = mysqli_fetch_assoc($resultsql)) {
                             
                             echo "<option value='$row[id_toko]'>$row[nama_toko]</option>";

                             // $nama_toko = $row['nama_toko'];
                              //echo '<option value="'.$row['id_toko'].'">'. $nama_toko.'</option>';
                            }
                          }        
                      ?>
                    </select>
                    
                  </div>
                </div>
              
    
    
      <div class="modal-footer">
                <button type="submit" class="btn btn-success" value="Simpan"><span class="glyphicon glyphicon-floppy-saved" style="padding-right: 2px"></span>Simpan</button>
                <button class="btn btn-danger" data-dismiss="modal" aria-hidden="true"><span class="glyphicon glyphicon-floppy-remove" style="padding-right: 2px"></span>Batal</button>                
            </div>
            </form>
    
            <?php
    }
            ?>
            </div>
        </div>
    </div>

</div>
  • 写回答

1条回答 默认 最新

  • douyi02577 2017-05-18 05:48
    关注

    The issue is because the html for these buttons are rendered again & previous event attached to these are not found. So you need to add the events for newly elements also. One good solution is to use jQuery on method to attach the event on dynamic elements as well. Use the below code to check

    <script type="text/javascript">
          $(document).ready(function (){
            $("body").on('click', '.open_modal', function (e){
              var m = $(this).attr("id");
              $.ajax({
                url: "user_edit.php",
                type: "GET",
                data : {username: m,},
                success: function (ajaxData){
                  $("#ModalEdit").html(ajaxData);
                  $("#ModalEdit").modal('show',{backdrop: 'true'});
                }
              });
            });
          });
        </script>
    
        <script type="text/javascript">
         $(document).ready(function (){
          $("body").on('click', '.open_delete', function (e){
            var m = $(this).attr("id");
            $.ajax({
              url: "user_delete.php",
              type: "GET",
              data : {username: m,},
              success: function (ajaxData){
                $("#ModalDelete").html(ajaxData);
                $("#ModalDelete").modal('show',{backdrop: 'true'});
              }
            });
          });
        });
      </script>
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

悬赏问题

  • ¥15 微信会员卡等级和折扣规则
  • ¥15 微信公众平台自制会员卡可以通过收款码收款码收款进行自动积分吗
  • ¥15 随身WiFi网络灯亮但是没有网络,如何解决?
  • ¥15 gdf格式的脑电数据如何处理matlab
  • ¥20 重新写的代码替换了之后运行hbuliderx就这样了
  • ¥100 监控抖音用户作品更新可以微信公众号提醒
  • ¥15 UE5 如何可以不渲染HDRIBackdrop背景
  • ¥70 2048小游戏毕设项目
  • ¥20 mysql架构,按照姓名分表
  • ¥15 MATLAB实现区间[a,b]上的Gauss-Legendre积分