다른 화면으로 탐색하지 않고 jQuery를 사용하여 양식을 제출하십시오.

Question

양식 제출로 인해 페이지가 탐색하고 AjaxSubmit을 사용하여 콘텐츠를 제출하지 않도록하려고합니다. 그러나 제출 버튼을 클릭하면 양식의 동작 속성에서 페이지로 이동합니다. 그녀는 JavaScript :

var options = {
    success: processLogin
};
$('#loginform').submit(function() {
    $(this).ajaxSubmit(options);
    return false;
});

그리고 그녀는 형식입니다.

<form id='loginform' action='login.php' method='post'>
    <table id='logintable'>
        <tr>
            <td>Room:</td>
            <td><input id='roomname' type='text' name='roomname' /></td>
        </tr>
        <tr>
            <td>Nickname:</td>
            <td><input id='nickname' type='text' name='nickname' /></td>
        </tr>
        <tr>
            <td colspan='2' class='center'><input type='submit' value='Submit' /></td>
    </table>
</form>

Answer 1

사용 event.preventDefault ()

$('#loginform').submit(function(e) {
    e.preventDefault();
    $(this).ajaxSubmit(options);
});

Answer 2

또 다른 옵션은 입력 HTML 태그를 <input id="save" type="Button" value="submit" /> JavaScript 후크를 제공하는 것 외에는 아무것도하지 않는 버튼을 제공합니다.

다음 JavaScript를 사용하여 Ajax 양식을 제출하십시오

$("#save").click(function() {
    $("#loginform").ajaxSubmit();
}

이렇게하면 Enter를 눌러 양식을 제출할 수있는 능력이 상실됩니다. 다음 jQuery 조각으로 이것을 극복 할 수 있습니다.

$("input").keypress(function(e) {
    if (e.which == 13) {
        $("#save").click();
    }
});