Populating dropdown from API

pull/3/head
Davide Bongiovanni 6 years ago
parent 1cefbfb744
commit 3f709d6628

@ -2,86 +2,107 @@ function overlay_in() {
$('.shadow').css({'display' : 'block'}); $('.shadow').css({'display' : 'block'});
$('.overlay').css({'display' : 'block'}); $('.overlay').css({'display' : 'block'});
$('.shadow').animate({'opacity' : 0.7}); $('.shadow').animate({'opacity' : 0.7});
$('.overlay').animate({'opacity' : 1.0, 'top' : '10%'}); $('.overlay').animate({'opacity' : 1.0, 'top' : '5%'});
} }
function overlay_out() { function overlay_out() {
$('.shadow').animate({'opacity' : 0.0}, function () { $('.shadow').animate({'opacity' : 0.0}, function () {
$('.overlay').css({'display' : 'none'}); $('.overlay').css({'display' : 'none'});
}); });
$('.overlay').animate({'opacity' : 0.0, 'top' : '5%'}, function () { $('.overlay').animate({'opacity' : 0.0, 'top' : '0'}, function () {
$('.shadow').css({'display' : 'none'}); $('.shadow').css({'display' : 'none'});
}); });
end_edit(); end_edit();
} }
function init_edit(partID) { function init_edit(partID) {
var block_input = $('<input type="text" class="part-edit-input" id="block-input" placeholder="Location">') // var block_input = $('<input type="text" class="part-edit-input" id="block-input" placeholder="Location">')
block_input.val($('#block-info').text()); // block_input.val($('#block-info').text());
$('#block-info').replaceWith(block_input); // $('#block-info').replaceWith(block_input);
var type_input = $('<input type="text" class="part-edit-input" id="type-input" placeholder="Manufacturer">') // var type_input = $('<input type="text" class="part-edit-input" id="type-input" placeholder="Manufacturer">')
type_input.val($('#type-info').text()); // type_input.val($('#type-info').text());
$('#type-info').replaceWith(type_input); // $('#type-info').replaceWith(type_input);
var partno_input = $('<input type="text" class="part-edit-input" id="partno-input" placeholder="Part number">') $('table#details tr#location td p').hide();
partno_input.val($('#partno-info').text()); $('table#details tr#location td select').show();
$('#partno-info').replaceWith(partno_input);
var description_input = $('<input type="text" class="part-edit-input" id="description-input" placeholder="Description">') $('table#details tr#partno td p').hide()
description_input.val($('#description-info').text()); $('table#details tr#partno td input').show()
$('#description-info').replaceWith(description_input);
var quantity_input = $('<input type="text" class="part-edit-input" id="quantity-input" placeholder="Quantity">') $('table#details tr#description td p').hide()
quantity_input.val($('#quantity-info').text()); $('table#details tr#description td input').show()
$('#quantity-info').replaceWith(quantity_input);
var notes_input = $('<input type="text" class="part-edit-input" id="notes-input" placeholder="Notes">') // var partno_input = $('<input type="text" class="part-edit-input" id="partno-input" placeholder="Part number">')
notes_input.val($('#notes-info').text()); // partno_input.val($('#partno-info').text());
$('#notes-info').replaceWith(notes_input); // $('table#details tr#partno td').replaceWith(partno_input);
// var description_input = $('<input type="text" class="part-edit-input" id="description-input" placeholder="Description">')
// description_input.val($('#description-info').text());
// $('#description-info').replaceWith(description_input);
// var quantity_input = $('<input type="text" class="part-edit-input" id="quantity-input" placeholder="Quantity">')
// quantity_input.val($('#quantity-info').text());
// $('#quantity-info').replaceWith(quantity_input);
// var notes_input = $('<input type="text" class="part-edit-input" id="notes-input" placeholder="Notes">')
// notes_input.val($('#notes-info').text());
// $('#notes-info').replaceWith(notes_input);
var datasheet_input = $('<input type="file" class="part-edit-file" id="datasheet-input" accept=".pdf">') var datasheet_input = $('<input type="file" class="part-edit-file" id="datasheet-input" accept=".pdf">')
$('#datasheet-info').replaceWith(datasheet_input); $('#datasheet-info').replaceWith(datasheet_input);
var newButton = '<div class="round-button"><a href="#" onclick="save(' + partID + ')"><i class="fa fa-check" aria-hidden="true"></i></a></div>'; var newButton = '<div class="round-button-left"><a href="#" onclick="save(' + partID + ')"><i class="fa fa-check" aria-hidden="true"></i></a></div>';
$('.round-button').replaceWith(newButton); $('.round-button-left').replaceWith(newButton);
} }
function new_entry() { function new_entry() {
$('#block-info').text(''); $('table#details tr#location td').text('');
$('#type-info').text(''); $('table#details tr#partno td').text('');
$('#partno-info').text(''); $('table#details tr#description td').text('');
$('#description-info').text(''); // $('#block-info').text('');
$('#quantity-info').text(''); // $('#type-info').text('');
$('#notes-info').text(''); // $('#partno-info').text('');
// $('#description-info').text('');
// $('#quantity-info').text('');
// $('#notes-info').text('');
init_edit(-1); init_edit(-1);
overlay_in(); overlay_in();
} }
function end_edit() { function end_edit() {
var block_par = '<p id="block-info">' + $('#block-input').val() + '</p>'; $('table#details tr#location td p').show();
$('#block-input').replaceWith(block_par); $('table#details tr#location td select').hide();
$('table#details tr#partno td p').show()
$('table#details tr#partno td input').hide()
var type_par = '<p id="type-info">' + $('#type-input').val() + '</p>'; $('table#details tr#description td p').show()
$('#type-input').replaceWith(type_par); $('table#details tr#description td input').hide()
var partno_par = '<p id="partno-info">' + $('#partno-input').val() + '</p>'; // var block_par = '<p id="block-info">' + $('#block-input').val() + '</p>';
$('#partno-input').replaceWith(partno_par); // $('#block-input').replaceWith(block_par);
var description_par = '<p id="description-info">' + $('#description-input').val() + '</p>'; // var type_par = '<p id="type-info">' + $('#type-input').val() + '</p>';
$('#description-input').replaceWith(description_par); // $('#type-input').replaceWith(type_par);
var quantity_par = '<p id="quantity-info">' + $('#quantity-input').val() + '</p>'; // var partno_par = '<p id="partno-info">' + $('#partno-input').val() + '</p>';
$('#quantity-input').replaceWith(quantity_par); // $('#partno-input').replaceWith(partno_par);
var notes_par = '<p id="notes-info">' + $('#notes-input').val() + '</p>'; // var description_par = '<p id="description-info">' + $('#description-input').val() + '</p>';
$('#notes-input').replaceWith(notes_par); // $('#description-input').replaceWith(description_par);
var datasheet_par = '<p id="datasheet-info"><i class="fa fa-circle-o-notch fa-spin fa-fw"></i></p>'; // var quantity_par = '<p id="quantity-info">' + $('#quantity-input').val() + '</p>';
$('#datasheet-input').replaceWith(datasheet_par); // $('#quantity-input').replaceWith(quantity_par);
var newButton = '<div class="round-button"><a href="#" id="edit-button"><i class="fa fa-pencil" aria-hidden="true"></i></a></div>'; // var notes_par = '<p id="notes-info">' + $('#notes-input').val() + '</p>';
$('.round-button').replaceWith(newButton); // $('#notes-input').replaceWith(notes_par);
// var datasheet_par = '<p id="datasheet-info"><i class="fa fa-circle-o-notch fa-spin fa-fw"></i></p>';
// $('#datasheet-input').replaceWith(datasheet_par);
var newButton = '<div class="round-button-left"><a href="#" id="edit-button"><i class="fa fa-pencil" aria-hidden="true"></i></a></div>';
$('.round-button-left').replaceWith(newButton);
} }
function save(partID) { function save(partID) {
@ -200,9 +221,11 @@ function delete_entry(partID) {
function show_part_info(partID) { function show_part_info(partID) {
$.getJSON('http://127.0.0.1:5000/parts/getpartinfo/' + partID, function(data) { $.getJSON('http://127.0.0.1:5000/parts/getpartinfo/' + partID, function(data) {
$('table#details tr#location td').text(text_filter(data.name)); // name is the location friendly name $('table#details tr#location td p').text(text_filter(data.name)); // name is the location friendly name
$('table#details tr#partno td').text(text_filter(data.partno)); $('table#details tr#partno td p').text(text_filter(data.partno));
$('table#details tr#description td').text(text_filter(data.description)); $('table#details tr#partno td input').val(text_filter(data.partno));
$('table#details tr#description td p').text(text_filter(data.description));
$('table#details tr#description td input').val(text_filter(data.description));
$('img#map').attr('src', 'parts/map/' + data.map); $('img#map').attr('src', 'parts/map/' + data.map);
if (data.datasheet != null) if (data.datasheet != null)
$('tr#datasheet-head').html($('<td>DATASHEET: <a href="http://127.0.0.1:5000/parts/getfile/' + data.datasheet.substring(0, data.datasheet.length - 4) + '"><i class="fa fa-file-text" aria-hidden="true"></i></a></td>')); $('tr#datasheet-head').html($('<td>DATASHEET: <a href="http://127.0.0.1:5000/parts/getfile/' + data.datasheet.substring(0, data.datasheet.length - 4) + '"><i class="fa fa-file-text" aria-hidden="true"></i></a></td>'));
@ -238,7 +261,6 @@ function perform_query() {
newRow.append($('<td id="location"></td>').text(text_filter(data[i].location_descriptor))); newRow.append($('<td id="location"></td>').text(text_filter(data[i].location_descriptor)));
newRow.append($('<td id="partno"></td>').text(text_filter(data[i].partno))); newRow.append($('<td id="partno"></td>').text(text_filter(data[i].partno)));
newRow.append($('<td id="description"></td>').text(text_filter(data[i].description))); newRow.append($('<td id="description"></td>').text(text_filter(data[i].description)));
newRow.append($('<td id="docs"></td>').text(text_filter(data[i].docs)));
$('#results').append(newRow); $('#results').append(newRow);
} }
if(data.length == 0) { if(data.length == 0) {
@ -254,6 +276,11 @@ function perform_query() {
} }
$(document).ready(function() { $(document).ready(function() {
$.getJSON('http://127.0.0.1:5000/parts/getlocations', function(data){
$.each(data, function(i, val) {
$('table#details tr#location td select').append('<option value="' + i + '">' + val + '</option>');
});
});
$.ajaxSetup({ cache: false }); $.ajaxSetup({ cache: false });
$('.search-bar').on('keyup', function() { $('.search-bar').on('keyup', function() {
perform_query(); perform_query();

@ -166,7 +166,7 @@ div label input {
left: 20%; left: 20%;
padding: 0; padding: 0;
position: fixed; position: fixed;
top:5% !important; top:0;
width: 60%; width: 60%;
z-index: 201; z-index: 201;
border-radius: 2pt; border-radius: 2pt;
@ -296,7 +296,7 @@ table#results #partno {
} }
table#results #description { table#results #description {
width: 65%; width: 70%;
} }
table#results #docs { table#results #docs {
@ -367,6 +367,11 @@ table#details #datasheet-head td {
padding-top: 16pt; padding-top: 16pt;
} }
td p {
margin: 0;
padding: 0;
}
.overlay img#map { .overlay img#map {
position: absolute; position: absolute;
right: 5%; right: 5%;
@ -374,3 +379,8 @@ table#details #datasheet-head td {
height: calc(90% - 42pt); height: calc(90% - 42pt);
max-width: 50%; max-width: 50%;
} }
.pinfo-input {
display: none;
width: 90%;
}
Loading…
Cancel
Save