我正在使用 jquery mobile 捕获数据并发送到 parse.com。下面的代码是正在使用的表格。
我能够毫无问题地捕获 BPsystolic 和 BPDiastolic 数据。但是我注意到只有当“你在过去 2 小时内吃过饭了吗?” 滑块设置为“YES”是在解析数据库中捕获的数据。
我的问题是当滑块值设置为“NO”时如何捕获滑块值?
表格代码
<div data-role="page" id="page1">
<div data-role="content">
<form id="healthform">
<div data-role="fieldcontain">
<label for="eatentime">
Have you eaten in the last 2 hours?
</label>
<select name="toggleswitch1" id="eatentime" data-role="slider"
data-mini="true">
<option value="off">
Yes
</option>
<option value="on">
No
</option>
</select>
</div>
<div data-role="fieldcontain">
<label for="BPsystolic">
Blood Pressure - Systolic (Top)
</label>
<input name="BPsystolic" id="BPsystolic" value="" type="number"
data-mini="true">
</div>
<div data-role="fieldcontain">
<label for="BPDiastolic">
Blood Pressure - Diastolic (Bottom)
</label>
<input name="BPDiastolic" id="BPDiastolic" value="" type="number"
data-mini="true">
</div>
<input type="submit" value="Upload Data">
</form>
发送数据进行解析的代码
<script>
var SightingObject;
var db;
function errorCB(e) {
//We should do something here - the database isn't technically required per se, but it should
//work.
console.log("DB Error");
console.dir(e);
}
function online() {
//return false;
return navigator.onLine;
}
$(document).ready(function() {
//initialize db
db = window.openDatabase("sightingdb", "1.0", "Sighting Database", 200000);
db.transaction(createDB, errorCB, initApp);
function createDB(trans) {
trans.executeSql("create table if not exists sighting(id INTEGER PRIMARY KEY,BPDiastolic,BPsystolic,eatentime)");
}
});
/*
I'm run after the db is setup.
*/
function initApp() {
if(online()) {
Parse.initialize("x", "x");
SightingObject = Parse.Object.extend("SightingObject");
//do we have existing objects in the db we can upload?
db.transaction(function(trans) {
trans.executeSql("select * from sighting", [], function(trans,result) {
//do we have rows?
if(result.rows.length > 0) {
console.log("Ok, we need to push stuff up");
for(var i=0, len=result.rows.length; i<len; i++) {
var row = result.rows.item(i);
(function(row) {
//Parse will try to save everything, including ID, so make a quick new ob
var report = {};
report.BPDiastolic = row.BPDiastolic;
report.BPsystolic = row.BPsystolic;
report.eatentime = row.eatentime;
saveToParse(report, function() {
console.log("i need to delete row "+row.id);
db.transaction(function(trans) {
trans.executeSql("delete from sighting where id = ?", [row.id]);
}, errorCB);
});
}(row));
}
}
},errorCB);
}, errorCB, function() {
console.log("Done uploading the old rows");
});
}
$("#healthform").on("submit", function(e) {
e.preventDefault();
/*
gather the values - normally we'd do a bit of validation, but since UFO chasers
are known for their rigorous and rational pursuit of science, this will not be necessary
*/
var report = {};
report.BPDiastolic = $("#BPDiastolic").val();
report.BPsystolic = $("#BPsystolic").val();
report.eatentime = $("#eatentime").val();
console.log("To report: ",report);
//ok, disable the form while submitting and show a loading gfx
$(this).attr("disabled","disabled");
$("#loadingGraphic").show();
if(online()) {
console.log("I'm online, send to parse");
saveToParse(report,resetForm);
} else {
console.log("I'm offline, save to WebSQL");
db.transaction(function(trans) {
trans.executeSql("insert into sighting(BPDiastolic,BPsystolic,eatentime) values(?,?,?)", [report.BPDiastolic,report.BPsystolic,report.eatentime]);
}, errorCB, resetForm);
}
});
};
function saveToParse(ob,successCB) {
var sightingObject = new SightingObject();
sightingObject.save(ob, {
success: function(object) {
console.log("Saved to parse.");
console.dir(object);
successCB(object);
},
error: function(model, error) {
console.log("Error!");
console.dir(error);
}
});
}
//handles removing the disabled form stuff and loading gfx
function resetForm() {
$("#BPDiastolic").val("");
$("#BPsystolic").val("");
$("#eatentime").val("");
$("#sightForm").removeAttr("disabled","disabled");
$("#loadingGraphic").hide();
var status = $("#status");
if(online()) {
status.fadeIn().html("Your data has been saved!").fadeOut(4000);
} else {
status.fadeIn().html("Your data has been saved locally and will be uploaded next time you are online!").fadeOut(4000);
}
}
</script>