0

各フォームが個々のアイテムをデータベースに追加するページに複数のフォームがあります。すべての製品データを送信する [すべて追加] ボタンもあります。以下の基本的な html を参照してください。

<button type="submit">All all products</a>

<form>
<input type="hidden" name="Product" value="ProductA" />
<input type="checkbox" name="optionAll" value="Option All" /> Option All 
<input type="checkbox" name="option" value="Option 1" checked="checked" /> Option 1 
<input type="checkbox" name="option" value="Option 2" /> Option 2
<button type="submit">Add this product"</button> 
</form>

<form>
<input type="hidden" name="Product" value="ProductB" />
<input type="checkbox" name="optionAll" value="Option All" /> Option All 
<input type="checkbox" name="option" value="Option 1" checked="checked" /> Option 1 
<input type="checkbox" name="option" value="Option 2" checked="checked" /> Option 2 
<button type="submit">Add this product"</button> 
</form>

シリアル化されたフォーム データを次の JSON 形式に投稿しようとしています。

products = {
    "ProductA": {
        "option": ["Option 1"] // only 1 checkbox is checked
    },
    "ProductB": {
        "optionAll": "Option All",
        "option": ["Option 1", "Option 2"] // both checkboxes are checked
    }   
}

シリアル化されたデータのマッピングをいじっていましたが、上記のように JSON 形式にすることができませんでした。

data = $.map($('form').serializeArray(), function(el, i){
    var json = {};
    ???
    return json;
});
console.log(data)

あなたの助けに感謝！

4

2 に答える 2

2 
var result = {};  // object to hold final result

$('button[type="submit"]').on('click', function() {

    $('form').each(function() {  // loop start for each form

      var sr = $(this).serializeArray(),
          options = [];

      result[sr[0].value] = {}; // insert Product value and initiate it as object

      $.each(sr, function() {  // loop start for each checkbox

        if(this.name == 'option') {

            options.push(this.value);

        }

      });

      // if all checkbox are checked then insert the property optionAll

      if(options.length == $('input[type="checkbox"][name="option"]',this).length) {

        result[sr[0].value].optionAll = 'Option All';  

      }

      result[sr[0].value].option = options;

   });

   console.log(result);
});
于 2012-05-03T17:15:03.177 に答える
0

JavaScriptオブジェクトをJSON文字列としてシリアル化するには、単に使用します

JSON.stringify(myobject)

したがって、あなたの仕事は主にオブジェクトを作成することです:

 var products = {
 };

 products['ProductA'] = $('input[name="Products"]').find(':checked').val();

等々...

しかし、実際には html を少し変更する必要があります。同じ名前の入力を使用しないようにする必要があります。少なくともIDを与えるようにしてください。

于 2012-05-03T16:49:26.047 に答える