PHP and JQuery working with $.getjson

I am a newbie at at Ajax and to delete a list item asynchronously but its not working. Am getting the right xhr response but the item is not getting deleted. It’s very frustrating. Could anyone point out the error?

Here’s the html:


<ul id="subscribers">
<li>
		<a href="delete.php?id=3">[x]</a>
				<a href="user.php?id=3">Albertus Ackleton</a>
			</li>
			<li>
				<a href="delete.php?id=6">[x]</a>
				<a href="user.php?id=6">Bob Burry</a>
			</li>
			<li>
				<a href="delete.php?id=2">[x]</a>
				<a href="user.php?id=2">Cora Cuddlesby</a>
			</li>
			<li>
				<a href="delete.php?id=5">[x]</a>
				<a href="user.php?id=5">Derren Drufus</a>
			</li>
		</ul>

The Javascript:

	<script type="text/javascript">
			$(document).ready(subscribers_init);
			function subscribers_init(){
				$('#subscribers li a:first-child')
					.click(delete_subscriber);
			}
			function delete_subscriber(){
				var id=this.href.replace(/.*=/,'');
				this.id='delete_link_'+id;
				if(confirm('Are you sure you want to delete this subscriber?'))
					$.getJSON('delete.php?id='+id, remove_row);
				return false;
			}
			function remove_row(data){
				if(!data.success)
					return alert(data.error);
				$('#delete_link_'+data.id)
					.closest('li')
					.slideUp('slow',function(){
						$(this).remove();
					});
			}
		</script>

And the PHP:

<?php
$id = (int)$_REQUEST['id'];
echo ( !($id&#37;2) )? 	"{'id':$id,'success':1}" : "{'id':$id,'success':0,'error':'Could not delete subscriber'}";

As you can see, I am sending json back to the script.

I would do something like this:


$(document).ready(function(){
    $("ul#subscribers li a:first-child").click(function(e){
        var link = $(this).attr('href');
        var pare = $(this).parent();
        if(confirm('Are you sure to delete?')){
            $.post(link, {}, function(data){
                if(data.result == 'Yes'){
                    $(pare).slideUp('slow', function(){
                        $(this).remove();
                    });
                    e.preventDefault();
                }
                else{
                    alert(data.error);
                    e.preventDefault();
                }
            }, 'json');
        }
        else{
            e.preventDefault();
        }
        e.preventDefault();
    });
});

Your server side script look like this for above code:


$id = (int)$_GET['id'];
// execute query to delete the record
$result = true;
if($result){
    echo '{"result":"Yes"}';
}
else{
    echo '{"error":"There was error on deleting the item"}';
}

Sweet. It works.

Raju, your code is so much better than the **** I got (and pasted) from that ****** Packt book. I am trying to get better at jQuery these days. Could I have your advice on these areas:

  1. I was trying out $.getJson. Could this example not have worked with the same or should I avoid get requests when I am deleting or updating data?
  2. I see you just got your Zend certification. I want to be getting somewhere with my PHP skills too. How do I get better at building apps?