add_port.html 2.1 KB
Newer Older
1
{% load i18n %}
2 3
{% load widget_tweaks %}

Leonidas Poulopoulos's avatar
Leonidas Poulopoulos committed
4 5 6 7


    <form id="add_port_form" method="POST"  class="form-horizontal">
    {% csrf_token %}
8 9 10 11 12 13 14 15 16 17
		<div class="form-group {% if form.port.errors %} has-error {% endif %}">
		<div class="col-md-5">
		            {% render_field form.port class+="form-control" placeholder="Port number, eg. 8088" %}
		            {% if form.port.errors %} <span class="help-block"> {{ form.port.errors|join:", " }} </span>
		            {% endif %}
		        </div>
		        		<div class="col-md-4">
		        		<button class="btn-warning btn btn-md btn-outline" id="canceladdportbtn" type="button">{% trans "Cancel" %}</button>
		        		<button class="btn-success btn btn-md btn-outline" id="addportbtn" type="button">{% trans "Add" %}</button>
		        </div>
Leonidas Poulopoulos's avatar
Leonidas Poulopoulos committed
18 19
		</div>
    </form>
20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65
<script>
$(document).ready( function(){
	$('#addportbtn').click(function(){
		$.ajax({
		url:"{% url add-port %}", 
		data:$("#add_port_form").serialize(),
		type: "POST",
		cache: false,
		success:function(data){
				try {
					value = data.value;
					text = data.text;
					if (typeof value === 'undefined' && typeof text === 'undefined'){
						$('#port_diag').html(data);	
					}
					else{
						$('#id_port').append($("<option></option>").attr("value",value).text(text));
						$('#id_destinationport').append($("<option></option>").attr("value",value).text(text));
						$('#id_sourceport').append($("<option></option>").attr("value",value).text(text));
						$('#port_diag').html('');
						$('#addnewport').hide();
						$(".new_port").show();
						reArrangeSelect2("id_sourceport");
						reArrangeSelect2("id_destinationport");
						reArrangeSelect2("id_port");
					}
				}
				catch (exception) {
					$('#port_diag').html(data);
				}					
			}
			});
	});
	$('#canceladdportbtn').click(function(){
		$('#port_diag').html('');
		$('#addnewport').hide();
		$(".new_port").show();
	});
	
		function reArrangeSelect2(elementId) {
	   $("#"+elementId).html($("#"+elementId+" option").sort(function(a, b) {
			return parseInt(a.text) == parseInt(b.text) ? 0 : parseInt(a.text) < parseInt(b.text) ? -1 : 1
		}));
	}
});
			</script>