drecy22400 2013-04-21 06:28 采纳率: 0%
浏览 86
已采纳

使用AJAX和Codeigniter从数据库中删除用户

I'm trying to delete users from the database using AJAX and Code Igniter. When I click the delete link, the user gets deleted but the page gets redirected and success message is displayed. AJAX does not seem to work in my code. Here's HTML:

<table class="table table-hover">
<thead>
<tr>
<th>#</th>
<th>First Name</th>
<th>Last Name</th>
<th>Email</th>
<th>Username</th>
<th>Password</th>
<th>Action</th>
</tr>
</thead>
<tbody>




<?php foreach($users as $u){?>
<tr>



<td><?php echo $u['id']; ?></td>



<td><?php echo $u['firstname']; ?></td>



<td><?php echo $u['lastname']; ?></td>



<td><?php echo $u['email']; ?></td>



<td><?php echo $u['username']; ?></td>



<td><?php echo $u['password']; ?></td>



<td>



<a href="#" >Edit</a>  |
<?php  $id=$u['id'];?>
<a  href="<?php echo site_url("users/delete/$id")?>" class="delete">Delete</a>



</td>
<?php }?>
</tr>



</tbody>
</table>

and here's AJAX:

 $(document).ready(function(){

     $(".delete").click(function(){
       alert("Delete?");
         var href = $(this).attr("href");
         var btn = this;

        $.ajax({
          type: "GET",
          url: href,
          success: function(response) {

          if (response == "Success")
          {
             $(btn).closest('tr').fadeOut("slow");
          }
          else
          {
            alert("Error");
          }

       }
    });

   })
  });

and lastly the controller function to delete the user in Codeigniter

 public function delete($id)//for deleting the user
  {
    $this->load->model('Users_m');

    $delete=$this->Users_m->delete_user($id);
      if($delete)
        {
          echo "Success";
        }
     else
        {
          echo "Error";
        }

  }

Where am I making the mistake?

  • 写回答

6条回答 默认 最新

  • duancongjue9202 2013-04-21 06:54
    关注

    Just to expand on the correct answers already given here.

    Basically, your JS code should look like:

    $(document).ready(function(){
    
     $(".delete").click(function(event){
         alert("Delete?");
         var href = $(this).attr("href")
         var btn = this;
    
          $.ajax({
            type: "GET",
            url: href,
            success: function(response) {
    
              if (response == "Success")
              {
                $(btn).closest('tr').fadeOut("slow");
              }
              else
              {
                alert("Error");
              }
    
            }
          });
         event.preventDefault();
      })
    });
    

    The event.preventDefault() part is important here. As it prevents the browser from taking the default action it takes if you click on an element.

    In the case of a link, that would be redirecting you to the url that is defined in the href parameter. Which is what you see happening.

    Your manually defined event is always triggered first, so the ajax request is indeed started, but right after that your event handler, the browser starts handling the default action, breaks off the ajax request, and navigates to the clicked link.

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(5条)

报告相同问题?

悬赏问题

  • ¥15 我这模型写的不对吗?为什么lingo解出来的下面影子价格这一溜少一个变量
  • ¥50 树莓派安卓APK系统签名
  • ¥15 maple软件,用solve求反函数出现rootof,怎么办?
  • ¥65 汇编语言除法溢出问题
  • ¥15 Visual Studio问题
  • ¥20 求一个html代码,有偿
  • ¥100 关于使用MATLAB中copularnd函数的问题
  • ¥20 在虚拟机的pycharm上
  • ¥15 jupyterthemes 设置完毕后没有效果
  • ¥15 matlab图像高斯低通滤波