0

シンプルなログインフォームがあります。

<form id="login" action="process/login_process.php" method="POST" name="login" accept-charset="utf-8">
<div><label>Username:</label><input type="text" name="username" data-ideal="required"/></div>
<div><label>Password:</label><input type="password" name="password" data-ideal="required"/></div>
<div><button id="submit" type="submit">Login</button></div>
</form>

フォームの検証と全体的な美しさのために JQ-IDEALFORMS を使用しています。ajax経由でフォームを送信する方法を理解するのに最も苦労しています。これは私がこれまで持っているJavaScriptです：

<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src="http://code.jquery.com/ui/1.9.0/jquery-ui.min.js"></script>
<script src="javascripts/jquery.idealforms.min.js"></script>
<script>
    var options = {
        onSuccess: function() {
            $.post('process/login_process.php', $myform.serialize())
            alert(responseXML);
        }
    };
    var $myform = $('#login').idealforms(options).data('idealforms');
    $('#submit').click(function() {
        $.post('process/login_process.php', $myform.serialize());
        alert('hello');
    });

ドキュメントの非常に限られた指示に従い、options 変数の onSuccess アクションに $.post を追加しました。それはうまくいきません。次に、送信ボタンにリスナーを追加しようとしましたが、アラート ボックスが表示されません。つまり、リスナーがトリガーされることはありません。これはどのように行うべきですか？フォームを送信できましたが、送信すると、XML がエコーされている php ページにページがリダイレクトされます。何らかの理由で、ログイン ページにエコー バックさせることができません。

4

2 に答える 2

0

フォームのアクション属性では、フォームが送信されないように false を返すか、アクションをjavascript:void(0)...に変更する必要があります。

<form id="login" action="javascript:submitForm()" method="POST" name="login" accept-charset="utf-8">

そしてJSでは

var submitForm = function() {
    var options = {
       onSuccess: function() {
          $.post('process/login_process.php', $myform.serialize())
          alert(responseXML);
       }
    };
    var $myform = $('#login').idealforms(options).data('idealforms');
     //not sure this part is needed because Post already call in the success method of idealforms
    $.post('process/login_process.php', $myform.serialize());
    alert('hello');
};
于 2013-04-03T08:34:17.787 に答える
0

ajax でフォームを送信します。

var createForm = $("form#login");
var postData = createForm.serialize();

        $.ajax({
            type: "POST",
            url: "/Offers/CreateOffer",
            data: postData,
            success: function (result, textStatus, jqXhr) {
           }
         });
于 2013-04-03T08:35:49.767 に答える