jquery - 送信ボタンではなくリンクをクリックしてAJAX REQUESTを作成する方法

Question

送信ボタンの代わりにリンクをクリックして AJAX REQUEST を作成するにはどうすればよいですか? リンクをクリックして、入力フィールドからデータを POST したい

Answer 1

$('selector').click(function(e){
  e.preventDefault();
  $.ajax({
       url: "<where to post>",
       type: "POST",//type of posting the data
       data: <what to post>,
       success: function (data) {
         //what to do in success
       },
       error: function(xhr, ajaxOptions, thrownError){
          //what to do in error
       },
       timeout : 15000//timeout of the ajax call
  });

});

Answer 2

AJAX の仕組みは次のとおりです。

$('#link_id').click(function(event){
   event.preventDefault(); // prevent default behavior of link click
   // now make an AJAX request to server_side_file.php by passing some data
   $.post('server_side_file.php', {parameter : some_value}, function(response){
      //now you've got `response` from server, play with it like
      alert(response);
   });
});

Answer 3

JQueryとフォームのシリアル化機能を使用できます

$('#A-id-selector').click(function() {
    $.ajax({
        type:'POST', 
        url: 'target.url', 
        data:$('#Form-id-selector').serialize(), 
        success: function(response) {
          // Any code to execute on a successful return
        }
    });
});

Answer 4

jQueryで

$('#link-selector').on('click', function(event) {
    event.preventDefault();
    $.post('url', {$('form selector').serialize()}, function(json) {
        // proccess results
    }, 'json');
});