Question

我现在有了一个新问题。一些原始代码来自question I previously posted,，但我的views.py文件包含一个名为modify_checked_value的新函数，此次我的jQuery文件已被不同地修改，以向服务器发送请求以更新保存的任务那里。我的网址文件中添加了一行，并对我用于呈现列表的小HTML模板片段进行了细微更改。

这是我在五个小时前发现并试图修复它的问题，但仍然不成功，因为我还是Django的新手。我有一个“待办事项列表”，我将其保存在Django数据库中。我正在使用CharField将任务表示为字符串，并使用BooleanField来确定任务是否完成（如果有人稍后发现任务未完成，则选择取消选中）。

假设我有一些没有选中复选框的任务，因为在创建时最初不会检查它们。当我单击一个并打印出数据库的QuerySet时，我注意到从该模型返回的布尔值为true，因此 str （）函数输出“是”作为输出的一部分串。当我点击相同的复选框时，布尔字段应该设置为false，因此__str__function应该输出一个“否”作为字符串的一部分。

但事实证明，在检查和取消选中之后，任务仍然将其布尔字段设置为true，因此当我完全刷新页面并且模板呈现已保存的任务时，到达该任务时，标签越过了。任务的布尔字段应该是假的，因此不应该越过标签。

当我取消选中浏览器中的复选框时，如何更新数据库中的任务对象以使其布尔字段设置为false？到目前为止，每当我选中我的任务旁边的复选框时，该布尔字段将始终为真。

请查看我的新代码并帮助我！

ToDoList.js：

$(function(){

    $("#addTaskButton").click(function(){
        var taskInput = $("#taskInputTextField").val();
        var newTask = $("<div class=\"checkbox-task\"><label class=\"task\" ><input type=\"checkbox\">" + taskInput + "</label></div>");
        if (taskInput.length === 0)
        {
            alert("There is nothing entered in the Task input field. Please enter a task before clicking on the \"Add Task\" button.");
            return false;
        }

        $.post("process-request", {new_task: taskInput});

//            $("#listOfThingsToDo").load(document.URL + ' #listOfThingsToDo');
            //$("#listOfThingsToDo").append("<div class=\"checkbox-task\"><label><input class=\"task\" type=\"checkbox\">" + data[data.length - 1].fields.task_to_do + "</label></div>");

        $("#listOfThingsToDo").append(newTask);
            $(".checkbox-task:last").hide();
            $(".checkbox-task:last").fadeIn(500);

        $(newTask).change(function(event){
            console.log($(event.target).is(':checked'));

             //$.post("modify-checked-value", {this_checkbox_is_checked: $(event.target).is(':checked'), index_of_element: $(newTask).index()});
                if ($(event.target).is(':checked'))
                {
                    $.post("modify-checked-value", {this_checkbox_is_checked: true, index_of_element: $(newTask).index()});
                    $(event.target).parent().css("text-decoration", "line-through");
                    $(event.target).attr("checked:\"checked\"");
                }
                else
                {
                     $.post("modify-checked-value", {this_checkbox_is_checked: false, index_of_element: $(newTask).index()});
                    $(event.target).parent().css("text-decoration", "none");
                    $(event.target).removeAttr("checked");
                }


        });
    });

    $("#removeAllTasksButton").click(function() {
        $.post("remove-all-tasks", null, function(data) {
            $("#listOfThingsToDo").empty();
        });
    });

    $('#listOfThingsToDo :checkbox').click(function() {
        var $this = $(this);
        console.log($this.is(':checked'));
        console.log("asdglkadfjglkadfjglkfdajgl");
        console.log($(event.target).parent().parent().index());

        //$.post("modify-checked-value", {this_checkbox_is_checked: $(event.target).is(':checked'), index_of_element: $(event.target).parent().parent().index()});

        if ($this.is(':checked')) 
        {
            $.post("modify-checked-value", {this_checkbox_is_checked: true, index_of_element: $(event.target).parent().parent().index()});
            $(event.target).parent().css("text-decoration", "line-through");
        } 
        else 
        {
            $.post("modify-checked-value", {this_checkbox_is_checked: false, index_of_element: $(event.target).parent().parent().index()});
            $(event.target).parent().css("text-decoration", "none");
            $(event.target).removeAttr("checked");
        }


    });

});

views.py :(仅限附加代码）

@csrf_exempt
def modify_checked_value(request):
    checkbox_value = request.POST["this_checkbox_is_checked"]
    print("Checkbox Value: " + checkbox_value)
    checkbox_id = int(request.POST["index_of_element"])
    print(checkbox_id)
    task_to_modify = ToDoChecklistTask.objects.all()[checkbox_id]
    print("Ready to print")

    task_to_modify.task_check_marked = models.BooleanField(default = checkbox_value);
    task_to_modify.save();


    print(ToDoChecklistTask.objects.all())
    data_to_return = serializers.serialize('json', ToDoChecklistTask.objects.all());
    return HttpResponse(data_to_return, 'application/json')

ListOfTasks.html：

{% for task in task_list %}
                <div class="checkbox-task"><label class="task" {% if task.task_check_marked %} style="text-decoration: line-through"{% endif %} ><input type="checkbox" {% if task.task_check_marked %} checked="checked" {% endif %}>{{ task.task_to_do }}</label></div>
{% endfor %}

如果您需要查看更多代码，请告诉我我将丢失哪些代码，并相应地编辑我的问题。

编辑：根据要求，这是models.py的代码：

from django.db import models

class ToDoChecklistTask(models.Model):
    task_to_do = models.CharField(max_length = 200)
    task_check_marked = models.BooleanField()

    def __str__(self):
        stringToReturn = "Task: " + self.task_to_do + " Is the task done? "
        if self.task_check_marked:
            stringToReturn += "Yes"
        else:
            stringToReturn += "No"
        return stringToReturn

Answer 1

跟随你的代码有点困难，我无法确切地知道发生了什么。但有一个明确的问题是依赖于一个索引作为checkbox_id，然后使用该值索引到ToDoChecklistTask.objects.all()。你没有展示你的模型，所以我不知道你是否定义了任何排序，但很可能是db以不同的顺序返回数据，因此索引不匹配。

相反，您应该专门使用对象的pk值作为复选框ID，并在通过ToDoChecklistTask.objects.get(pk=checkbox_id)检索项目时使用该值。

Answer 2

我有人在我身边工作，看看这个，我们花了几个小时试图解决这个问题;我们终于找到了问题所在。我们从那里决定更新我的元素通过各自的主键访问的方式。

在modify_checked_value函数中，我将checkbox_value赋值为request.POST [“this_checkbox_is_checked”]。然后我将它分配给我的模型字段task_check_marked。之前，我知道checkbox_value是一个布尔值。但是因为我使用JSON在Web浏览器和服务器之间传输数据， request.POST [“this_checkbox_is_checked”]实际上是一个字符串，而不是我期望的布尔值。

因为checkbox_value被分配了一个字符串，所以Python实际上评估为true，因此我注意到当我双击最初未选中的复选框并刷新页面时，检查出现在复选框。

现在，modify_checked_value函数看起来像这样，因此网站正常运行：

@csrf_exempt def modify_checked_value(request): checkbox_value = request.POST["this_checkbox_is_checked"] checkbox_id = int(request.POST["id_of_element"]) task_to_modify = ToDoChecklistTask.objects.get(id = checkbox_id) task_to_modify.task_check_marked = (checkbox_value == "true") task_to_modify.save() data_to_return = serializers.serialize('json', ToDoChecklistTask.objects.all()); return HttpResponse(data_to_return, 'application/json')

无论如何，除非你认为有必要，否则我不会发布剩余的代码，因为它需要花费太多时间。

Django：使用我的“ToDoChecklistTask”模型

2 个答案: