Sending checklist form values using jQuery, Flask, Python, and HTML

[DaveG]

I am doing a web app. This web app will provide python information that will be parsed and used to communicate with a database and part of the information will be used to control a bluetooth module connected to an FTDI board using PySerial. The first part of my webapp I have managed to do by myself the code is: (first its javascript then html they are both in separate files)\[code\] $(function() { $('#form1').hide(); $('#Submit').hide(); $('#Refresh').hide(); $("#Inquiry").click(function() { //$('#spinner').show(); $('#Inquiry').hide(); $.ajax({ type: "GET", url: $SCRIPT_ROOT + "/echo/", contentType: "application/json; charset=utf-8", data: {"command" : "Inquiry 30 NAME"}/*{ echoValue: $('input[name="echoText"]').val() }*/, success: function(data) { len = function(devices) { var L=0; $.each(devices, function(i,elem) { L++; }); return L; } length = len(data); //$('#echoResult').text(String(length)); //$('#echoResult').text(data["value1"] + "; " + data["value2"] + "; " + data["value3"] + "; " + data["value4"]); for (var i = 1; i <= length; i++) { //device.text(data["value" + i]); $('#form1').append('<input type="checkbox" name="Device' + i + '" value='http://stackoverflow.com/questions/15892959/+ i +'>' + data["value" + i] +'<br />'); } $('#form1').show(); $('#Submit').show(); $('#Refresh').show(); } }); }); $('#Submit').click(function() { var num_checked_devices = $('input:checked').length; var oElements = {}; $('#form1 input:checked').each(function() { oElements[this.name] = this.value; }); $.ajax({ type: "POST", url: $SCRIPT_ROOT + "/echo/", data: oElements, contentType: "application/json; charset=utf-8", success: function(data) { $('#test').text(data['Device1']); } }); }); var loading; $("#loader").hide(); jQuery.ajaxSetup({ beforeSend: function() { loading= setTimeout("$('#loader').show()", 300); }, complete: function(){ clearTimeout(loading); $("#loader").hide(); }, success: function() { alert("done"); } });});<strong>Press button to begin scanning for devices:<br /></strong><button type='button' id='Inquiry' name='Inquiry Button'>Inquiry Scan</button><br /><br /><img src="http://stackoverflow.com/questions/15892959/ajax-loader.gif" id="loader" height="16px" width="16px"></img><!-- <div id='echoResult'></div> --><form id='form1'></form><input type="submit" value="http://stackoverflow.com/questions/15892959/Add Devices" /><button type='button' id='Submit' name='Submit Button'>Add Devices</button><button type='button' id='Refresh' name='Refresh Button'>Refresh</button><br /><br /><div id="test"></div>\[/code\]I sending right now a 'GET' request that has a command in JSON format via AJAX and jQuery to flask. Flask then response to this request my revealing a list of devices the bluetooth module "find" (although this is not currently happening it is just fake data). The devices are presented in a checklist form, and after the user checks the devices he wants to add and he submits it, the devices are added to the database. Now here is where I am having isses. I am not sure the best way to send this data or how to send it. Any help please....