Question

我正在使用jquery mobile来捕获数据并发送到parse.com。以下代码是正在使用的表单。

我能够毫无问题地捕获BPsystolic和BPDiastolic数据。但是我注意到只有在“你最近2小时吃过饭吗？” slider设置为“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>

将数据发送到PARSE的代码

<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>

Answer 1

这不是代码的问题，更多的是在提交数据后页面未正确刷新。我添加了jquery location.reload（）来解决这个问题，现在工作正常。

如何在parse.com中捕获jquery移动滑块值？

1 个答案: