connecting jquery with PHP in backend to delete

186 Views Asked by At

I am creating a todo list which can sort, add things to do and remove things to so. I am using Jquery. I am new to javascript and php.

(1) Upon clicking on the delete icon. It should connect with PHP mysql in the back end to delete it aswell. I tried many way to link them to delete the entire row them but all attempts were unsuccessful.

(2) Upon clicking on the check box it should always remain checked unless uncheck. I dont know how to move on with this too. I tried all the youtube and stack methods.

my database is checklist table is checklist I have checklist_id, checkbox, thingstodo, sortable_order

My code:

$("#projects").on("click", "input[type=checkbox]", function(){
        $(this).closest("li").animate(function(){
            $(this).checked()
        });
    });

    $("#projects").on("click", ".ui-icon-trash", function(){
        $(this).closest("li").slideUp(function(){
            $(this).remove();

        });
    });
1

There are 1 best solutions below

1
On

HTML: Each todo list row should have it's unique identifier that corresponds to your database row (checklist_id)

JS:

$("#projects").on("click", ".ui-icon-trash", function () {
$(this).closest("li").slideUp(function () {
    // get the associated id for that row
    var checklistID = $(this).data('id'); // change this to whichever tag you are using in your html

    // this is the part that connects to your php code, your php code will be the one responsible to connect to mysql
    $.ajax({
    url: 'http://urltophp.com/deleteChecklist', // url to your php function
    data: {id : checklistID },
    type: 'post',
    dataType: "json",
    success: function (response) {
        if (response) {
        $(this).remove();
        } else {
        // show an error if you like
        }
    }
    });
});
});

PHP:

function deleteRow($params) {
$query = "DELETE FROM checklist WHERE checklist_id = " . $params['id'];

// call database to exceute this query

return true;  // or false depending if your query was successful or not
}