如何在JS中的Django multiplechoicefield上點擊框

我正在使用電子郵件預覽工具，並希望基於所選框使用Javascript來顯示Django multiplechoicefield的格式化版本。我試圖做一些事來的效果：如何在JS中的Django multiplechoicefield上點擊框

$('#email_preview').click(function (click) { 
    event.preventDefault(); 
    my_js_function("{{ form.data.modchoicfield }}"); 
});

我也試過：

$('#email_preview').click(function (click) { 
    event.preventDefault(); 
    my_js_function($('#id_modchoicfield').val()); 
});

由於它是一個預覽我不想發送電子郵件，只是根據他們的輸入顯示它看起來像什麼。由於輸出只是空白，所以這些都不會做任何事情。我用靜態字符串測試了這個函數，它工作的很好，所以我知道這是我試圖訪問字段值的方式。任何幫助將是真棒，如果你需要更多的細節讓我知道，謝謝！

編輯：下面是關於如何在窗體和模板級別上運行的更深入的想法。

電子郵件的形式：

class EmailForm(forms.Form): 
    # Using dummy value for specific_incident because queryset must be initialized on ModelChoiceField 

OPTIONS = (
    ("Empty",), 
) 

contacts = forms.MultipleChoiceField(widget=forms.CheckboxSelectMultiple(attrs={"checked": ""}), choices=OPTIONS) 

def __init__(self, associated_emails): 
    super(EmailForm, self).__init__() 
    self.fields['contacts'].choices = tuple([(contact['id'], 
               str(contact['name']) + " " + str(contact['email']())) 
              for contact in associated_emails])

模板：

<form action={% url "email.views.send_email"%} method="post" class='col-sm-5'> 
    {% csrf_token %} 
    {% bootstrap_field form.contacts %} 
     <button type="submit" id="email_preview" class="btn btn-primary"> 
      {% bootstrap_icon "glyphicon glyphicon-zoom-in" %} Preview Email 
     </button> 
    {% endbuttons %} 

    <div id="formatted_email" class="hidden"></div> 
</form> 

<script> 
    $('#email_preview').click(function (event) { 
     event.preventDefault(); 
     copyTextToClipboard($('#id_contacts').val()); 
    }); 
</script>

而且奇怪的是這工作完全正常，在完全相同的腳本標籤完全相同的模板：

{ 
    'mfield': $('#id_mfield').val(), //modelchoicefield in same form 
    'another_mfield': $('#id_another_mfield').val(), //modelchoicefield in same form 
    'cfield': $('#id_cfield').val(), //charfield in same form 
}

來源

2015-11-19 Obj3ctiv3_C_88

你的第一次嘗試絕對不會工作，因爲表單不知道表單有什麼最新值。您的第二種方法在控制檯中是否有任何內容？另外請確保您正確輸入了id名稱。 –

@ShangWang謝謝，我不確定它是否會，因爲我知道你可以通過$（'＃cfield'）。val（）獲得一個charfield的值，因爲這不是我給的。數據一槍。至於名稱，我99.9999％肯定，我直接從html標籤複製它，並檢查大概20倍現在大聲笑。 –

您的表單已被提交，因爲您沒有正確調用'event.preventDefault（）'。您應該將'event'作爲函數參數而不是'click'。 –

$('#email_preview').click(function (event) { // <-- it should be 'event' btw 
    event.preventDefault(); 
    my_js_function("{{ form.modchoicfield }}"); // <-- no need for 'data' 
});

來源

2015-11-19 15:04:07 doniyor

我曾嘗試過，但當我嘗試傳遞「{{form.modchoicfield}}」時，由於某種原因它提交了表單。這就是爲什麼我試圖使用form.data.modchoicfield。 –

試試這個，

$('#email_preview').click(function (event) { 
    event.preventDefault(); 
    my_js_function($('#id_modchoicfield').val()); 
});

來源

2015-11-20 07:27:49 Yuv

如何在JS中的Django multiplechoicefield上點擊框

回答

相關問題