0

変数をphpスクリプトに送信するために.ajaxを使用しているWebページがあります。php ページは、あたかもそこに移動しているかのようにブラウザーに読み込まれています。スクリプトはデータを正しく読み込んでいるため、私の問題はナビゲーションを停止し、ユーザーを元のページにとどめることです。私のフォームのコードは次のとおりです。

echo "<form method='post' action='addTask.php' id='myform'>\n";
echo "<input name='addtask' id='addtask' maxlength='64'/><br/>\n";
echo "<input type='submit' name='submit' id='submit' value='Add Task'/>\n";
echo "</form>\n";

私のjqueryのコードは次のとおりです。

    $(function(){
    $('#myform').submit(function(e){
        e.stopPropagation();
        $.ajax({
            url: 'addTask.php',
            type: 'POST',
            data: {},
            success: alert("Success")
            });
        });
    });

私は試しました:e.preventDefault()、e.stopPropagation()、およびfalseを返します。どんな助けでも大歓迎です。

        $("#submit").click(function(e){
        e.preventDefault();
        $.ajax({
            type: "POST",
            url: "addtask.php",
            data: { }
        })
        .done(function() {
            alert( "success" );
        })
        .fail(function() {
            alert( "error" );
        });

$(function(){
    $('#myform').submit(function(e){
        e.preventDefault();
        $.ajax({
            url: 'addTask.php',
            type: 'POST',
            data: {},
            success: function(){alert("Success")}
        });
    });
});
4

2 に答える 2

2

ajax呼び出しの後にfalseを返すことで、フォームの送信を防ぐことに成功しました。

$(function () {
    $('#myform').submit(function (e) {
        $.ajax({
            url: 'addTask.php',
            type: 'POST',
            data: {},
            success: alert("Success")
        });
        return false;
    });
});

http://jsfiddle.net/5c3n2/

編集:

上記のコードreturn falseは、フォームの送信を防ぐ方法を示しています。ただし、gloomy.penguin で述べたsuccessように、関数にする必要があります。また、jsFiddle では呼び出しが成功しないため、 を追加しましcompleteた。

$(function () {
    $('#myform').submit(function (e) {
        $.ajax({
            url: 'addTask.php',
            type: 'POST',
            data: {},
            success: function() {alert("Success");},
            complete: function() {alert("Completed");}
        });
        return false;
    });
});

http://jsfiddle.net/5c3n2/2/

于 2013-11-07T21:40:57.933 に答える