当试图阻止提交时,jquery移动表单提交重置表单

时间:2013-02-07 11:14:14

标签: android jquery forms cordova jquery-mobile

所以我有一个表单,如果某些字段没有效果,它就不会提交表单,而是会发出alert()告诉他们修复它。我面临的问题是它重置了表单,用户添加的所有数据都消失了。由于我的表单太大,我只会告诉你我的jQuery函数:

$('#microForm').live('submit', function(){
                if ($('#barcode').val() != '') {
                    insertForm();
                } else {
                    alert('Insert Barcode');
                    return false;
                }
});

<form id="microForm">

我在Android应用程序上尝试这个,带有phonegap - 将表单插入本地数据库表(即sqlite)。

任何帮助将不胜感激。感谢。

2 个答案:

答案 0 :(得分:1)

这应该有效,看看我为你做的一个例子:http://jsfiddle.net/Gajotres/bGdM6/

您应该使用 on 而不是 live

$('#microForm').on('submit', function(event){
    if ($('#barcode').val() != '') {
        alert('Submit');
    } else {         
        alert('Insert Barcode');
        return false;
    }
});

直播 之间进行更改,了解其工作原理。

答案 1 :(得分:1)

我对@ Gajotres jsFiddle做了一个小调整:

您可以检查提交按钮点击/点击事件,然后提交表单,如果您需要的所有值都在那里,而不是使用表单上的提交

JS:

$('#submit-btn').on('click', function(event) {
    if ($('#barcode').val() != '') {
        alert('Submit');
        $('#microForm').submit(); // <-- submit the form
    } else {
        alert('Insert Barcode');
        event.preventDefault();
        return false;
    }
});

HTML

<div data-role="page" id="index">
    <div data-theme="a" data-role="header">
        <h3>
            First Page
        </h3>
        <a href="#second" class="ui-btn-right">Next</a>
    </div>

    <div data-role="content">
        <form id="microForm">
            <input type="text" value="" id="barcode"/>
            <input type="submit" id="submit-btn" value="Submit"/>
        </form>
    </div>

    <div data-theme="a" data-role="footer" data-position="fixed">

    </div>
</div>