私はこれを行うためにajaxを使用しており、バックエンドではres.endと応答していますが、これまでは一度だけPOSTできます。ここに私のコードです：ページを更新せずに同じURLからPOSTすることはできますか？

サーバー

app.post("/awesome", passwordless.restricted({ failureRedirect: "/" }), (req, res, next) => { 
    // ...do a bunch of stuff 
    res.end(); 
});

クライアントこれは私が似たようなのために使用したものである

$("[data-new-save]").on("click", function() { 
    $.ajax({ 
    url: "/awesome", 
    type: "POST", 
    data: awesomeDetails, 
    success: function() { 
     console.log("Cool beans"); 
     refreshContent(); // Re-renders content 

     // Feedback 
     $("nav").after("<div class=\"flash success\">Success!</div>"); 

     setTimeout(function() { 
     $(".flash").remove(); 
     }, 5000); 
    }, 
    error: function() { 
     console.log("Welp"); 

     // Feedback 
     $(".navigation").after("<div class=\"flash error\">Failure</div>"); 

     setTimeout(function() { 
     $(".flash").remove(); 
     }, 5000); 
    } 
    }); 
});

出典

2017-04-04 NetOperator Wibby

を、あなたの最初のPOST後にボタンが機能しなくなったことを言っていますか？または、サーバーは2番目の要求を処理しませんか？ –

うーん！ボタンは反応しません。 –

これは、イベント委譲のためのケースのように聞こえます。私が持っている最良の推測は、あなたのrefreshContent()関数が元の[data-new-save]要素を削除して新しい要素を作成しているということです。これにより、バインドされたclickイベントが削除されるだけでなく、元々呼び出されたときに存在していたDOMノードのプロパティになります。あなたは<body>タグが再描画されないと仮定していますが、いくつかの子セットしかないと仮定していますので、<body>をターゲットにしてセレクタを探してください試合"[data-new-save]"は、それが正常に機能する必要があります

$('body').on('click', "[data-new-save]", function() { 
    $.ajax({ 
    url: "/awesome", 
    type: "POST", 
    data: awesomeDetails, 
    success: function() { 
     console.log("Cool beans"); 
     refreshContent(); // Re-renders content 

     // Feedback 
     $("nav").after("<div class=\"flash success\">Success!</div>"); 

     setTimeout(function() { 
     $(".flash").remove(); 
     }, 5000); 
    }, 
    error: function() { 
     console.log("Welp"); 

     // Feedback 
     $(".navigation").after("<div class=\"flash error\">Failure</div>"); 

     setTimeout(function() { 
     $(".flash").remove(); 
     }, 5000); 
    } 
    }); 
});

出典

2017-04-04 17:02:11

それは、ありがとう！ちょうどあなたが 'イベント委任 'を考え出したと思ったとき。 –

：

$(document).ready(function() { 
    $('#myform').on('submit', function(e) { 
     e.preventDefault(); 
     $.ajax({ 
      url : $(this).attr('action') ||  window.location.pathname, 
      type: "GET", 
      data: $(this).serialize(), 
      success: function (data) { 
       $("#form_output").html(data); 
      }, 
      error: function (jXHR, textStatus, errorThrown) { 
       alert(errorThrown); 
      } 
     }); 
    }); 
});

出典

2017-04-04 17:00:59

ページを更新せずに同じURLからPOSTすることはできますか？

サーバー

クライアントこれは私が似たようなのために使用したものである

答えて

関連する問題