JQuery: Ajax.load question

Question

I have a table of a recent web guest who has registered. One of the columns is a simple “send email” link in which I welcome jQuery with jquery when it clicked and fired ajax.load for a php script backend that sends an email to this person.

What I cannot understand is simply to change the link to which something like “Sent!” Was placed. and this is no longer a link.

Code:

$(".sendEmail").click(function(){
var element = $(this);
var guest_id = element.attr("id");                                         
$.post("WebGuest_SendEmail.php",{id: guest_id}, function(data) {
    $(this).html(data);  //NOT SURE WHAT TO DO HERE ON SUCCESS.
    });                            
return false;                              
});

Answer 1

I would let the user know what was going on and then tell them what happened. So, tell them when it is sent, and then tell them when it was sent.

Same:

$(".sendEmail").click(function(){
    var element = $(this);
    var guest_id  = element.attr("id");
    element.replaceWith('Sending...');                                                                               
    $.post("WebGuest_SendEmail.php",{id: guest_id}, function(data) {
        $(this).html(data);  //NOT SURE WHAT TO DO HERE ON SUCCESS.
        element.replaceWith('Sent!');
    });                                                    
    return false;                                                      
});

, , , if, - script. , , ..

Answer 2

- . , jQuery replaceWith() . HTML, , .

<script src="lib/jquery.js" type="text/javascript"></script>
<script>
$(document).ready(function() {
  $(".sendEmail").click(function(){
    var element = $(this);
    $.post("test.html", {}, function(data) {
      element.replaceWith("Sent!");    
    });
    return false;
  });
});
</script>

<a href="#" class="sendEmail">click me</a>

Answer 3

You can replace the link with the text "Sent!":

$(".sendEmail").click(function(){
var element = $(this);
var guest_id = element.attr("id");
element.replaceWith('Sent!');
$.post("WebGuest_SendEmail.php",{id: guest_id}, function(data) {
        $("#container").html(data);  //NOT SURE WHAT TO DO HERE ON SUCCESS.

    });                                                    
return false;                                                      
});