get checkbox items list from table in django without using django-forms

Viewed 382

here i have a table and there is a checkbox and i want to send email to all the checked data of that table. For this i have tried the following. But it is not working . The problem is while returning the list of checked items. The items which are checked are not being returned. How to solve it?

template

<tbody>
    {% for contact in contacts %}
        <tr>
        <td>
        <input name ="messages" type="checkbox" 
         id="contact-{{contact.id}}" value={{contact.id}}"> 

          <label for="contact-{{contact.id}}">{{ forloop.counter }}</label>
        </td>
        <td>{{ contact.name }}</td>
      <td>{{ contact.email }}</td>
        <td>{{ contact.subject }}</td>                          
        <td>{{ contact.message }}</td>
    </tr>
        {% endfor %}
        </tbody>
        //modal 
        <button class="btn btn-primary send-mail-to-selected-btn" type="button"
 data-toggle="modal" data-target="#item-unit-modal1">
Send Mail To Selected Email
</button>
        <div class="modal" id="item-unit-modal1">
            <div class="modal-body">
       <form method="POST" action="{% url 'admin:send_mail_selected_contact' %}" class="unit-ajax-form">
    {% csrf_token %}
    <p><label>Subject</label> <input type="text" name="subject" class="form-control required" placeholder="Enter subject" ></p>
     <p><label>Message</label> <textarea  name="message" class="form-control required" placeholder="Enter message" ></textarea></p>
     <button class="btn btn-primary mt-30">Send Mail</button>
      </form>
       </div>

views.py

def send_mail_selected_contact(request):
    selected_contact = ContactForm.objects.filter(id__in=request.POST.getlist('messages'))
    print(selected_contact)
    form = SendMailContact(request.POST or None)
    if form.is_valid():
        subject = form.cleaned_data['subject']
        message = form.cleaned_data['message']
        for contact in selected_contact:
            send_mail(subject, message, ' <settings.EMAIL_HOST_USER>', [contact.email])
        messages.success(request, 'Mail Sent')
        return redirect('admin:contact_message')

ajax

<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script>
$(document).on('click', '.send-mail-to-selected-btn', function(){
  var messages = new Array();
$("input:checked").each(function() {
    messages.push($(this).val());
});

console.log(messages); #here i can see the id of checked email
});

$.ajax({
    url:'admin/selected/send/mail/contact/',
    data:{
        name: name,
        messages: messages,
    }
});
</script>

forms.py

class SendMailContact(forms.Form):
    subject = forms.CharField(max_length=250)
    message = forms.CharField(widget=forms.Textarea)
1 Answers

You need to move your ajax call into the click handler.

Additionally, because you are listening for the click rather than submit event, there's no way for you to prevent the browser from also submitting that form. See below for an updated implementation that listens to submit, cancels the browser's default behavior, and makes the AJAX call on submit.

<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script>
$(document).on('submit', '.send-mail-to-selected-btn', function(ev){
ev.preventDefault()
  var messages = new Array();
$("input:checked").each(function() {
    messages.push($(this).val());
});

console.log(messages); #here i can see the id of checked email
$.ajax({
    url:'admin/selected/send/mail/contact/',
    data:{
        name: name,
        messages: messages,
    }
});
});
</script>
Related