blob: d2e8a20cfff11316e431696c0aea6ec0be96ec9e [file] [log] [blame]
<form>
<div class="customize_row">
<div class="customize_column">
<div>Available Dashboard Views</div>
<select name="selectfrom" id="select-from" multiple size="5">
{% for cp in unusedDashboards %}
<option value="{{ cp }}">{{ cp }}</option>
{% endfor %}
</select>
</div>
<div class="customize_column">
<br>
<div class="btn btn-success" id="customize-btn-add">Add &raquo;</div><br><br>
<div class="btn btn-success" id="customize-btn-remove">&laquo; Remove</div>
</div>
<div class="customize_column">
<div>Selected Dashboard Views</div>
<select name="selectto" id="select-to" multiple size="5">
{% for cp in dashboards %}
<option value="{{ cp }}">{{ cp }}</option>
{% endfor %}
</select>
<br>
<div class="btn btn-high btn-info" id="customize-btn-save">Save</div>
<div style="display: none" id="customize-msg-saving">Saving...</div>
</div>
<div class="customize_column">
<br>
<div class="btn btn-success" id="customize-btn-up">Up</div><br><br>
<div class="btn btn-success" id="customize-btn-down">Down</div>
</div>
</div>
</form>
<script>
$(document).ready(function() {
$('#customize-btn-add').click(function(){
$('#select-from option:selected').each( function() {
$('#select-to').append("<option value='"+$(this).val()+"'>"+$(this).text()+"</option>");
$(this).remove();
});
});
$('#customize-btn-remove').click(function(){
$('#select-to option:selected').each( function() {
$('#select-from').append("<option value='"+$(this).val()+"'>"+$(this).text()+"</option>");
$(this).remove();
});
});
$('#customize-btn-up').bind('click', function() {
$('#select-to option:selected').each( function() {
var newPos = $('#select-to option').index(this) - 1;
if (newPos > -1) {
$('#select-to option').eq(newPos).before("<option value='"+$(this).val()+"' selected='selected'>"+$(this).text()+"</option>");
$(this).remove();
}
});
});
$('#customize-btn-down').bind('click', function() {
var countOptions = $('#select-to option').size();
$('#select-to option:selected').each( function() {
var newPos = $('#select-to option').index(this) + 1;
if (newPos < countOptions) {
$('#select-to option').eq(newPos).after("<option value='"+$(this).val()+"' selected='selected'>"+$(this).text()+"</option>");
$(this).remove();
}
});
});
$('#customize-btn-save').bind('click', function() {
$("#customize-btn-save").hide();
$("#customize-msg-saving").show();
var items=[];
$("#select-to option").each(function() { items.push($(this).val()); });
$.ajax({
url: '/customize/',
dataType: 'json',
data: {
dashboards: items.join(","),
csrfmiddlewaretoken: "{{ csrf_token }}" // < here
},
type: 'POST',
error: function (jqXHR, textStatus, errorThrown) {
errorDialog("Error", textStatus + " " + jqXHR.responseText);
$("#customize-btn-save").show();
$("#customize-msg-saving").hide();
},
success: function () {
location.reload();
}
});
});
});
</script>