add an ajax/php todolist


I’m trying to add in a basic app appli page an Ajax/PHP todolist. But it’s not working.

I just put all of the code in the page. Surely something wrong, because the code, alone, is working.

<div class="wrap">

		<div class="task-list">




				$query = mysql_query("SELECT * FROM tasks ORDER BY date ASC, time ASC");

				$numrows = mysql_num_rows($query);


					while( $row = mysql_fetch_assoc( $query ) ){

						$task_id = $row['id'];

						$task_name = $row['task'];

						$date = $row['date'];

						$time = $row['time'];

						echo '<li>


								<img id="'.$task_id.'" class="delete-button" width="10px" src="images/close.png" />








		<form class="add-new-task" autocomplete="off">

			<input type="text" name="new-task" placeholder="Nouvelle tâche" />


	</div><!-- #wrap -->

	<!-- JavaScript Files Go Here -->

	<script src=""></script>



		add_task(); // Call the add_task function

		delete_task(); // Call the delete_task function

		function add_task() {


				var new_task = $('.add-new-task input[name=new-task]').val();

				if(new_task != ''){

					$.post('includes/add-task.php', { task: new_task }, function( data ) {

						$('.add-new-task input[name=new-task]').val('');

						$(data).appendTo('.task-list ul').hide().fadeIn();




				return false; // Ensure that the form does not submit twice



		function delete_task() {


				var current_element = $(this);

				var id = $(this).attr('id');

				$.post('includes/delete-task.php', { task_id: id }, function() {

					current_element.parent().fadeOut("fast", function() { $(this).remove(); });





And the includes are in /views/site/includes like /CSS and /images

The todolist is showing the entries, but not adding new.

There’s surely something to put on an other file or directory perhaps ?

I someone could show me my errors please.


Very cordially,