Question

此代码从正在执行json_encode的php文件中获取数据，该文件从csv文件中提取信息。我想在第二个循环中围绕每组值的父div。我尝试使用newDiv2，但它用.sub_row包装每个.field。

而不是：

 <div class="row"> // This one happens to only have one payment
     <div class="sum_field">Total: 79.99</div>
          <div class="field">BENV5239</div> // Details of payment
          <div class="field">11111</div>
</div>
 <div class="row"> // Based on Vendor ID
     <div class="sum_field">Total: 2487.01</div> // Sums up all payments for that Vendor
     <div class="field">BENV2137</div>
     <div class="field">11111</div>
     <div class="field">BENV2137</div>
     <div class="field">111111</div>
</div>
<div class="row"></div> // Another Vendor ID

应该是这样的：

 <div class="row">
     <div class="sum_field">Total: 200.00</div>
     <div class="sub_row">  // one payment
          <div class="field">BENV5239</div> // Details of payment
          <div class="field">11111</div>
     </div>
</div>
 <div class="row">
     <div class="sum_field">Total: 2487.01</div>
  <div class="sub_row"> // each payment that has the same vendor id is in it's own div
     <div class="field">BENV2137</div> 
     <div class="field">11111</div>
 </div>
 <div class="sub_row">
     <div class="field">BENV2137</div>
     <div class="field">111111</div>
 </div>
</div>

PHP代码

 $(document).ready(function() {
 $.getJSON('WF-XML.php', function(data) {

    //JSON.stringify(data); 
    var prevCardCode = '';
    var newDiv;

    $.each(data, function(index, element) {
        if (element['CardCode'] != prevCardCode) {
            newDiv = $('<div/>').addClass('row').appendTo('#showdata');
            $('<div class="sum_field">' + 'Total: ' + element['payment_sum'] + '</div>').appendTo(newDiv);      
            }
        prevCardCode = element['CardCode'];

        $.each(element, function(key, value) {

            switch (key) {
                case 'InvKey':
                case 'PostDate':
                case 'City':
                break;

                default:
                //newDiv2 = $('<div/>').addClass('sub_row').appendTo('.row');
                $('<div class="field">' + value + '</div>').appendTo(newDiv);
                break;
                 }
             });
         });
     });
  });

JSON - 我正在循环这两次，第一次我只打印总和（在SQL中计算，第二次打印出其余信息。你可以看到最后一个2个对象是针对相同的供应商ID的 - 因此我希望这会在每个新供应商周围放置一个父div，然后是每个单独的付款。我的代码已经将每组付款包装到一个带有父div的供应商，但是我无法弄清楚如何用父div包装每笔个人付款。

 {"VendorID":"BENV5239","payment_sum":"79.99","Address":"525 Sapper St.","ZipCode":"19116"},
 {"VendorID":"BENV2137","payment_sum":"2487.01","InvPayAmnt":"108.92","Address":"340 Middle Road","ZipCode":"19037"},
 {"VendorID":"BENV2137","payment_sum":"2487.01","InvPayAmnt":"57.60","Address":"340 North Middle Road","ZipCode":"19037"}

Answer 1

 $(document).ready(function() {
 $.getJSON('WF-XML.php', function(data) {

//JSON.stringify(data); 
var prevCardCode = '';
var newDiv;

$.each(data, function(index, element) {
    if (element['CardCode'] != prevCardCode) {
        newDiv = $('<div/>').addClass('row').appendTo('#showdata');
        $('<div class="sum_field">' + 'Total: ' + element['payment_sum'] + '</div>').appendTo(newDiv);      
        }
    newDiv2 = $('<div/>').addClass('sub_row').appendTo(newDiv);
    prevCardCode = element['CardCode'];

    $.each(element, function(key, value) {

        switch (key) {
            case 'InvKey':
            case 'PostDate':
            case 'City':
            break;

            default:
            //newDiv2 = $('<div/>').addClass('sub_row').appendTo('.row');
            $('<div class="field">' + value + '</div>').appendTo(newDiv2);
            break;
             }
         });
     });
 });

}）;

jquery在每次迭代循环中包装div

1 个答案: