表单提交问题(第一次页面加载错误)

时间:2013-04-08 16:25:35

标签: javascript html5 forms

使用表单将数据插入本地数据库时遇到问题。无论出于何种原因,第一次单击提交按钮时,弹出“错误加载页面”消息并刷新表单页面,但如果我将信息重新输入表单并再次单击该按钮,则数据将输入数据库并且页面移动到#MoneyOrdersMain的正确位置。我很困惑可能导致这种情况的原因。任何帮助,将不胜感激。特别是导致表格第一次没有提交的原因是什么?

表格:

<form method="post" id="moneyorder_form" name="moneyorder_form" onsubmit="MOsubmit()">
            <!-- onsubmit="closeSelf()"> -->
            <div class="ui-grid-a">
                <div class="ui-block-a">
                    <p style="text-align: center; display: inline"><b>Number</b></p>
                    <p>
                        <input type="number" required="required" step="1" id="moCNumber" name="moCNumber">
                    </p>
                </div>
                <div class="ui-block-b">
                    <p style="text-align: center; display: inline"><b>Amount</b></p>
                    <p>
                        <input type="number" required="required" min=".01" step=".01" id="moCAmount" name="moCAmount">
                    </p>
                </div>
                <br />
            </div>
            <div class="ui-grid-solo">
                <div class="ui-block-a">
                    <input type="submit" data-role="button" value="Add" />
                </div>
            </div>
    </form>

MOsubmit()函数:

function MOsubmit() {
insertMoC($('#moCNumber').val(), $('#moCAmount').val(), "MoneyOrder");
$.mobile.changePage('#MoneyOrdersMain');
location.reload(true);
}

function insertMoC(moCNumber, moCAmount, moCType) {
db.transaction(function (tx) {
    tx.executeSql('INSERT INTO MoneyOrderChecks (moCNumber, moCAmount, moCType) VALUES (?, ?, ?)', [moCNumber, moCAmount, moCType]);
});
}

1 个答案:

答案 0 :(得分:0)

我相信我已经弄清了问题的一部分,以防其他人遇到同样类型的问题。我试图作为表单提交功能的一部分调用的页面#MoneyOrdersMain是保存表单的页面的父页面。当表单第一次提交时,这似乎导致了问题。由于MOsubmit函数包括刷新表单页面#MoneyOrdersMain不再是“父”并且可以接受表单数据。一切正常,因为我已将用户重定向到表单提交功能中的#MoneyOrdersMain以外的页面。但是,#MoneyOrdersMain是我最终希望用户在表单提交后结束的地方,这是我的下一个挑战。