Jquery Mobile Form Validation not working properly

问题:

The form should validate and if its not valid, the form should not proceed, but it is automatically transferring the app to another page...

HTML

<div data-role="page" id="newevent1">
<div data-role="header">
    <h1>New Event</h1>
</div>
<div data-role="content">
    <form id="newevent1info" name="newevent1info" align="left">
        <div data-role="fieldcontain">
            <label for="ename">Event Name:</label>
            <input align="right" type="text" id="ename" name="ename" />
        </div>
        <div data-role="fieldcontain">
            <fieldset data-role="controlgroup" data-type="horizontal">
                <legend>Date:</legend>
                <input type="date" id="date" name="date"/>
            </fieldset>
        </div>
        <div data-role="fieldcontain">
            <fieldset data-role="controlgroup" data-type="horizontal">
                <legend>Time:</legend>
                <input type="time" id="time" name="time" />
            </fieldset>
        </div>
        <div data-role="fieldcontain">
            <label for="descevent">Description: </label>
            <input type="text" id="descevent" name="descevent"/>
        </div>
        <button type="submit" name="submit">Create Event</button>
    </form>
</div>
</div>

JAVASCRIPT

    $('#newevent1info').submit(function (event) {
event.preventDefault();

if ($(this).validate({
rules: {
ename: {
required: true
},
descevent: {
required: true
},
date: {
required: true
},
time: {
required: true
},
}
}).form()) {

alert("success");

}
});

i want it to only alert success if all the form data is valid. what do i need to fix?

回答1:

Simply return false if not true.

$('#newevent1info').submit(function (event) {
    event.preventDefault();
    if ($(this).validate({
        rules: {
            ename: {
                required: true
            },
            descevent: {
                required: true
            },
            date: {
                required: true
            },
            time: {
                required: true
            },
        }
    }).form()){
            alert("success");
        } else {
            return false;
        }
});