POST本体の配列を送信する

Question

私は、AJAX POSTリクエストを介してNode/MongoDBサーバーに配列を送信しようとしています。本文には他の変数も含まれています。ここでは、クライアント側JSコードは次のとおりです。

function setupForm(){ 
    $("#add").submit(function(event) { 
     event.preventDefault(); 
     var name = $("#name").val(); 
     var logo = $("#logo").val(); 
     var phone = $("#phone").val(); 
     var email = $("#email").val(); 
     var address = $("#address").val(); 
     var postcode = $("#postcode").val(); 
     var openingHours = $("#openingHours").val(); 
     var loc = [44, 44]; 

     $.ajax({ 
      type: "POST", 
      url: "http://localhost:3000/services", 
      data: "name=" + name + "&logo=" + logo + "&phone=" + phone + "&email=" + email + "&address=" + address + "&postcode="+ postcode +"&openingHours=" + openingHours + "&loc=" + loc, 
      success: function(){alert('success');} 
     }); 
    }); 
} 

そしてここでは、サーバー側のコードは次のとおりです。

exports.addWine = function(req, res) { 
    var wine = req.body; 
    console.log('Adding wine: ' + JSON.stringify(wine)); 
    db.collection('services', function(err, collection) { 
     collection.insert(wine, {safe:true}, function(err, result) { 
      if (err) { 
       res.send({'error':'An error has occurred'}); 
      } else { 
       console.log('Success: ' + JSON.stringify(result[0])); 
       res.send(result[0]); 
      } 
     }); 
    }); 
} 

これは、データベースではなく、この形式で追加します。私は、配列にそれをしたいと思います：

"postcode" : "ugh", 
"openingHours" : "fhgfh", 
"loc" : "44,44" 

Answer 1

使用しているデータがあれば、POSTリクエストの本文にデータを送信することをお勧めします。これにより、JSONのおかげでデータ型（配列、boolなど）が保持されます。

$.post("http://localhost:3000/services", { 
     name: $("#name").val(), 
     loc: [44, 44] 
     ...etc 
    }, function(){alert('success');} 
); 

バックエンドは変更なしで正常に動作するはずです。ミドルウェアスタックにボディパーサーを追加する必要があります。 body-parserミドルウェアは本体をjavascriptオブジェクトに変換します。このオブジェクトをデータベースに直接入れることができます。

Answer 2

はjQueryの.serialize()と.serializeArray()を見てみましょう。彼らはあなたが探していることをすることができるはずです。

Answer 3

前述のように、serializeArray()を使用してください。余分なパラメータを追加するには、以下に示すように配列に追加するだけです。

function setupForm(){ 
    $("#add").submit(function(event) { 
     event.preventDefault(); 

     var data = $(this).serializeArray(); 
      // add extra parameters (don't forget brackets) 
      data.push({ name: 'loc[]', value: 44 }); 
      data.push({ name: 'loc[]', value: 44 }); 

     $.ajax({ 
      type: "POST", 
      url: "http://localhost:3000/services", 
      data: data, 
      success: function() { 
       alert('success'); 
      } 
     }); 
    }); 
} 

あなただけのクエリ文字列を構築するあなたの方法を引き続き使用したい場合は、&loc[]=44&loc[]=44を追加する必要がありますが、それは単にシリアル化機能のいずれかを使用して、長期的に優れています。