0

我正在使用 Django 从 HTML 接收检查项目。然后,Django 将在数组上运行循环以从列表中删除所有选中的项目。这是我的 HTML 代码。似乎 HTML 没有返回所有检查的项目。

脚本

<script>
    function MakeCheckList(){
    var checkedList = $('input:checkbox:checked[name="checkedbox"]').map(function() { return $(this).val(); }).get();
    $('input#checklist').val(checkedList);
    };
</script>
            
<div class="row">
    <button class="taskAdd" name="taskAdd" type="submit"><i class="fa fa-plus icon"></i>Add</button>
    <button class="taskCompleted" name="taskCompleted" formnovalidate="" type="submit" onclick="MakeCheckList();"><i class="fa fa-check icon"></i>Complete</button>
    <button class="taskDelete" name="taskDelete" formnovalidate="" type="submit" onclick="MakeCheckList();"><i class="fa fa-trash-o icon"></i>Delete</button>
</div>
 <ul  class="taskList">

{% for todo in todos %} <!-- django template lang - for loop -->
<li class="taskItem">
    <input type="checkbox" class="taskCheckbox" name="checkedbox" id="{{ todo.id }}" value="{{ todo.id }}">
    <label for="{{ todo.id }}"><span class="complete-">{{ todo.title }}</span></label>
    <span class="category-{{ todo.category }}">{{ todo.category.name }}</span>
    <span class="priority-{{ todo.priority }}">{{ todo.priority.name }}</span>
    <span class="status-{{ todo.status }}" >{{ todo.status.name }}</span>
    <span class="date-{{ todo.due_date }}" >{{ todo.due_date }}</span>
    <strong class="taskDate"><i class="fa fa-calendar"></i>{{ todo.created }}</strong>
</li>
{% endfor %}

**Django 代码 **

        def request_post(task_type):
                todo = TodoList.objects.get(id=int(todo_id))
                return todo
        
        #checkedlist = request.POST["checkedbox"].split(',')
        checkedlist = request.POST["checklist"].split(',')
        
        for todo_id in checkedlist:

            if "taskDelete" in request.POST:
                todo = request_post("taskDelete")
                todo.delete()

            if "taskCompleted" in request.POST:
                todo = request_post("taskCompleted")
                todo.status_id = 1
                todo.save()

但是,根据浏览器中的 Traceback 错误,它仅从选中的项目中获取一个值。

__class__   
<class 'django.utils.datastructures.MultiValueDict'>
key 
'checklist'
self    
{'category_select': '',
 'checkedbox': '71',
 'csrfmiddlewaretoken': 'H9fvZAv0rGSlyASyrZH5YXDdk3KXusw2bFDvMnLMDhFJkY9yDL9ECzJ0cV4baHez',
 'date': '',
 'description': '',
 'priority_select': '',
 'status_select': '',
 'taskDelete': ''}

4

1 回答 1

0

我很快重新制作了你的样品,一切似乎都很好。除了在您的代码中onclick=MakeCheckList();"似乎缺少一个"之后onclick=

function MakeCheckList(){
  var checkedList = $('input:checkbox:checked[name="checkedbox"]').map(function() { return $(this).val(); }).get();
    $('input#checklist').val(checkedList);
};
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<body>
  <div>
    <button class="taskDelete" name="taskDelete" onclick="MakeCheckList();">Delete</button>
  </div>
  <ul>
  <li><input type="checkbox" class="taskCheckbox" name="checkedbox" value="or another 1"/></li>
  <li><input type="checkbox" class="taskCheckbox" name="checkedbox" value="or another 2" checked/></li>
  <li><input type="checkbox" class="taskCheckbox" name="checkedbox" value="or another 3"/></li>
  <li><input type="checkbox" class="taskCheckbox" name="checkedbox" value="or another 4" checked/></li>
  </ul>
  <div>
    <input id="checklist"/>
  </div>
</body>

于 2021-04-01T17:07:05.427 回答