Commit 7ead74ae authored by Leonidas Poulopoulos's avatar Leonidas Poulopoulos

Fix issue with ports not updating. Implement selects with select2.js lib

parent 443afe60
.form-control .select2-choice {
border: 0;
border-radius: 2px;
}
.form-control .select2-choice .select2-arrow {
border-radius: 0 2px 2px 0;
}
.form-control.select2-container {
height: auto !important;
padding: 0;
}
.form-control.select2-container.select2-dropdown-open {
border-color: #5897FB;
border-radius: 3px 3px 0 0;
}
.form-control .select2-container.select2-dropdown-open .select2-choices {
border-radius: 3px 3px 0 0;
}
.form-control.select2-container .select2-choices {
border: 0 !important;
border-radius: 3px;
}
.control-group.warning .select2-container .select2-choice,
.control-group.warning .select2-container .select2-choices,
.control-group.warning .select2-container-active .select2-choice,
.control-group.warning .select2-container-active .select2-choices,
.control-group.warning .select2-dropdown-open.select2-drop-above .select2-choice,
.control-group.warning .select2-dropdown-open.select2-drop-above .select2-choices,
.control-group.warning .select2-container-multi.select2-container-active .select2-choices {
border: 1px solid #C09853 !important;
}
.control-group.warning .select2-container .select2-choice div {
border-left: 1px solid #C09853 !important;
background: #FCF8E3 !important;
}
.control-group.error .select2-container .select2-choice,
.control-group.error .select2-container .select2-choices,
.control-group.error .select2-container-active .select2-choice,
.control-group.error .select2-container-active .select2-choices,
.control-group.error .select2-dropdown-open.select2-drop-above .select2-choice,
.control-group.error .select2-dropdown-open.select2-drop-above .select2-choices,
.control-group.error .select2-container-multi.select2-container-active .select2-choices {
border: 1px solid #B94A48 !important;
}
.control-group.error .select2-container .select2-choice div {
border-left: 1px solid #B94A48 !important;
background: #F2DEDE !important;
}
.control-group.info .select2-container .select2-choice,
.control-group.info .select2-container .select2-choices,
.control-group.info .select2-container-active .select2-choice,
.control-group.info .select2-container-active .select2-choices,
.control-group.info .select2-dropdown-open.select2-drop-above .select2-choice,
.control-group.info .select2-dropdown-open.select2-drop-above .select2-choices,
.control-group.info .select2-container-multi.select2-container-active .select2-choices {
border: 1px solid #3A87AD !important;
}
.control-group.info .select2-container .select2-choice div {
border-left: 1px solid #3A87AD !important;
background: #D9EDF7 !important;
}
.control-group.success .select2-container .select2-choice,
.control-group.success .select2-container .select2-choices,
.control-group.success .select2-container-active .select2-choice,
.control-group.success .select2-container-active .select2-choices,
.control-group.success .select2-dropdown-open.select2-drop-above .select2-choice,
.control-group.success .select2-dropdown-open.select2-drop-above .select2-choices,
.control-group.success .select2-container-multi.select2-container-active .select2-choices {
border: 1px solid #468847 !important;
}
.control-group.success .select2-container .select2-choice div {
border-left: 1px solid #468847 !important;
background: #DFF0D8 !important;
}
This diff is collapsed.
This source diff could not be displayed because it is too large. You can view the blob instead.
This diff is collapsed.
...@@ -17,4 +17,49 @@ ...@@ -17,4 +17,49 @@
</div> </div>
</div> </div>
</form> </form>
<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>
\ No newline at end of file
...@@ -23,6 +23,7 @@ ...@@ -23,6 +23,7 @@
<link href="{{STATIC_URL}}b3theme/css/plugins/morris/morris-0.4.3.min.css" rel="stylesheet"> <link href="{{STATIC_URL}}b3theme/css/plugins/morris/morris-0.4.3.min.css" rel="stylesheet">
<link href="{{STATIC_URL}}b3theme/css/plugins/timeline/timeline.css" rel="stylesheet"> <link href="{{STATIC_URL}}b3theme/css/plugins/timeline/timeline.css" rel="stylesheet">
<link href="{{STATIC_URL}}datepicker/css/datepicker.css" rel="stylesheet"> <link href="{{STATIC_URL}}datepicker/css/datepicker.css" rel="stylesheet">
{% endblock %} {% endblock %}
{% block extraheadbottom %} {% block extraheadbottom %}
...@@ -74,17 +75,36 @@ ...@@ -74,17 +75,36 @@
} }
</style> </style>
<link href="{{STATIC_URL}}js/select2/select2.css" rel="stylesheet">
<link href="{{STATIC_URL}}js/select2/select2-bootstrap.css" rel="stylesheet">
{% endblock %} {% endblock %}
{% block pagejsbottom %} {% block pagejsbottom %}
<script type="text/javascript" src="{{STATIC_URL}}datepicker/js/bootstrap-datepicker.js"></script> <script type="text/javascript" src="{{STATIC_URL}}datepicker/js/bootstrap-datepicker.js"></script>
<script type="text/javascript" src="{{STATIC_URL}}js/select2/select2.js"></script>
<script> <script>
$(document).ready( function(){ $(document).ready( function(){
$('#id_then').removeAttr("multiple");
$("#id_protocol").select2();
$("#id_fragmenttype").select2();
$("#id_then").select2();
reArrangeSelect("id_sourceport");
$("#id_sourceport").select2({
placeholder: "Source Port(s)"
});
reArrangeSelect("id_destinationport");
$("#id_destinationport").select2({
placeholder: "Destination Port(s)"
});
reArrangeSelect("id_port");
$("#id_port").select2({
placeholder: "Port(s)"
});
$('#id_expires').datepicker({ $('#id_expires').datepicker({
startDate: '+1d', startDate: '+1d',
endDate: '+10d' endDate: '+10d'
}) });
$('#setFromAll').click(function(){ $('#setFromAll').click(function(){
$("#id_source").val('0.0.0.0/0'); $("#id_source").val('0.0.0.0/0');
}); });
...@@ -160,47 +180,11 @@ ...@@ -160,47 +180,11 @@
return false; return false;
}); });
$('body').on('click', "#addportbtn", 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();
}
}
catch (exception) {
$('#port_diag').html(data);
}
}
});
});
$('body').on('click', "#canceladdportbtn", function(){
$('#port_diag').html('');
$('#addnewport').hide();
$(".new_port").show();
});
{% comment %}
function reArrangeSelect(elementId) { function reArrangeSelect(elementId) {
$("#"+elementId).html($("#"+elementId+" option").sort(function(a, b) { $("#"+elementId).html($("#"+elementId+" option").sort(function(a, b) {
return int(a.text) == int(b.text) ? 0 : int(a.text) < int(b.text) ? -1 : 1 return parseInt(a.text) == parseInt(b.text) ? 0 : parseInt(a.text) < parseInt(b.text) ? -1 : 1
})); }));
} }
{% endcomment %}
}); });
</script> </script>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment