{% load crispy_forms_tags %}
<div class="col-6 mt-3">
<table class="table table-hover">
  <thead>
    <tr>
      <th scope="col">Benachrichtigung</th>
      <th scope="col">E-Mail</th>
      <th scope="col">Push</th>      
    </tr>
  </thead>
  <tbody id="checkboxes">
{% for formfield in notificationform %}
	{% if forloop.counter|divisibleby:2 %}
			<td>{{formfield}}</td>				
		</tr>
	{% else %}
		<tr>
			<td>{{formfield.label_tag}}</td>
			<td>{{formfield}}</td>
	{% endif %}
{% endfor %}
</tbody>
</table>
<!-- Flexbox container for aligning the toasts -->
</div>
<script>
	$('input:checkbox').change(
    function(){
    	ele = $(this).prop("name");
    	if(ele.indexOf("module") == -1){
	    	new_stat = 0;
	    	if($(this).prop("checked")){
	    		new_stat = 	1;
	    	}    	
	        $.ajax(
		    {
		        type: "GET",
		        url: "/dasettings/ajax",
		        data:{
		        	action : "update_notifications",
		        	fieldname : ele,
		        	new_stat : new_stat
		        },
		        success: function( data ) 
		        {		        	
		        	if(data['success']){
		        		$('#notchange_done').toast('show');	
		        	}
		        	else{
		        		$('#notchange_err').toast('show');
		        	}	        	
			    }
		     });
	    }
    });

    $(document).ready(function(){
    	$(".toast").toast({
            autohide: true,
            delay : 3000
        });
    })

</script>