在模板上隱藏ModelMultipleChoiceField以進行自定義輸入

Question

我希望用戶選擇屬於某個模型的多個元素。我不想使用django表單的默認'ctrl + click'輸入，但自己創建一個複選框表。

出於這個原因，我隱瞞了ModelMultipleChoiceField通過定義窗口小部件：

field = forms.ModelMultipleChoiceField(..., widget=forms.MultipleHiddenInput()) 

然後我添加表單元素到模板如下：

<form method="POST" class="locklist-form" id="locklist-form">{% csrf_token %} 
    {{ form.field }} 
</form> 

在這一步，我希望選擇選擇要添加到HTML頁面的元素（隱藏），以便我可以訪問元素選項並使用javascript修改它們。但是，它不會向HTML頁面添加任何內容。

我使用這種方法與其他類型的形式fieds。對於TextField HTML頁面有如圖所示的隱藏元素：

爲什麼它不與ModelMultipleChoiceField工作？我怎樣才能用Javascript修改這個字段的選擇？

編輯： MultipleHiddenInput renders only if with initial data是一個類似的問題。但是應用它並不會導致預期的解決方案。在這個問題上，則有望呈現以下爲隱藏： 但隨之而來的MultipleHiddenInput renders only if with initial data，當我修改窗體構造函數：

form = MyForm(initial={'field':MyModel.objects.all()}) 

繪製元素如下：

它也許有用，但不完全是預期的。我需要在對象列表中標記一些選中的選項。

Answer 1

我已經使用Javascript完成了它，而不是依賴於Django的功能。我將ModelMultipleChoiceField的表單直接添加到模板中（不隱藏）。然後我運行JavaScript腳本，當頁面加載：隱藏類的

var field = document.getElementById('id_field'); 
selecter.setAttribute('class', 'hidden'); 

CSS定義如下：

.hidden{ 
    display: none; 
} 

這得到我想要的局面。

在這一點上，我可以通過JavaScript修改某些項目：ModelMultipleChoiceField如下呈現隱藏

document.getElementById('id_field').options[index].selected = boolValue;