I am creating a TODOLIST app, Now i have the values on the looped li, what i want to achieve is now if i click on aech of the li, let the input checkbox be checked and at the same time toggle addition on line-through(text-decoration which i have the class as lineThrough)
This is the HTML.
$('#widget-todo').append('<li class="list-group-item mt-1 ml-0 togglist">\
<form action="" method="" id="#contact_us">\
@csrf\
@method('PUT')\
<input type="hidden" name="id" id="id" value="value.id">\
<input type="hidden" name="content" id="content" value="value.content">\
**<input type="checkbox" value="'+value.status+'" class="float-left my-auto mr-2 checkbox"\
style="position: relative; top:5px;" name="status" id="'+value.id+'">\**
</form>\
<input type="hidden" name="" value="value.status" id="status">\
<form action="" method="delete">\
<span class="cross togglist">'+value.content+'</span>\
@csrf\
@method('delete')\
<input type="hidden" name="del_id" value="'+value.id+'">\
<button type="submit" value="'+value.id+'" class="btn btn-sm float-right del_todo">\
<i class="fas fa-trash text-danger"></i></button>\
</form>\
</li>'
);
$(document).ready(function() {
$("ul").on("click", "li.togglist", function(){
$(this).toggleClass("lineThrough");
$(this).prop('checked', true);
});
Aucun commentaire:
Enregistrer un commentaire