Welcome Guest, Not a member yet? Register   Sign In
Not able to delete with AJAX
#1

[eluser]shinokada[/eluser]
I have the following jquery and controller. If I don't use AJAX it changes the status. But I want to use AJAX so that I don't need to reload the page again.

However when I use jquery, it does not work. It redirect me to the home page with # at the end. I added the second part which is plain html to test. The second part hide nicely without any problem.

I am hoping someone tells me what I need to change.

Thanks in advance.

jquery

Code:
$(".delete").click(function(event) {
        event.preventDefault();
    
    
    loading.fadeIn();
    var commentContainer = $(this).parent();
    var id = $(this).attr("id");
    // var string = 'id='+ id ;
        alert(id);
    $.ajax({
       type: "POST",
       url: "index.php/admin/messages/changestatus/"+id,
       // data: string,
       cache: false,
       complete: function(){
        commentContainer.slideUp('slow', function() {$(this).remove();});
        loading.fadeOut();
      }
      
     });
    
    
    return false;
        });

controller

Code:
function changestatus($id){
    
        $this->MMessages->changeMessageStatus($id);
    
            
  }

output html

Code:
<ul style="display: block;" id="message">
<li class="41">
<span class="user"><strong>shin</strong></span>
<span class="msg">  delete this as well</span>
<span class="date">2010-01-15 07:47:31</span>
<a href="#" id="41" class="delete">x</a>
    <div class="clear"></div></li>
<li class="40">
<span class="user"><strong>shin</strong></span>

<span class="msg">  delete me as well</span>
<span class="date">2010-01-14 16:01:44</span>
<a href="#" id="40" class="delete">x</a>
    <div class="clear"></div></li>
<li class="38">
<span class="user"><strong>shin</strong></span>
<span class="msg">automatically add user name. you don't need to type if you are logged in.</span>
<span class="date">2010-01-14 15:56:07</span>
<a href="#" id="38" class="delete">x</a>

    <div class="clear"></div></li>
<li class="37">
<span class="user"><strong>shin </strong></span>
<span class="msg">add delete to this message
</span>
<span class="date">2010-01-14 14:32:55</span>
<a href="#" id="37" class="delete">x</a>
    <div class="clear"></div></li>
...
...
</ul>

            
    
Second part which is pure html

    <ul id="another">
    <li><a href="#">you can't delete me</a></li>
    
    <li><a href="#" class="delete">delete this</a></li>
    </ul>
#2

[eluser]flaky[/eluser]
since you are using ajax post, use it properly
Code:
//javascript
$.ajax({
       type: "POST",
       url: "index.php/admin/messages/changestatus/",
       data: {item_id: id},
       cache: false,
       complete: function(){
        commentContainer.slideUp('slow', function() {$(this).remove();});
        loading.fadeOut();
      }
      
     });

//controller
function changestatus(){
    
$this->MMessages->changeMessageStatus($this->input->post('item_id'));    
            
}
#3

[eluser]shinokada[/eluser]
Thanks for your reply. It still redirect me to the home page with # at the end.
#4

[eluser]flaky[/eluser]
Use firebug for javascript debugging, and put the error here (if there is any).
#5

[eluser]shinokada[/eluser]
It does not produce any errors. It redirect to the home page.




Theme © iAndrew 2016 - Forum software by © MyBB