创建用于 XML 导出的多维对象

我正在导入一个包含大量发票数据的 csv 文件。该数据需要根据供应商 ID 分组在一起，以显示每个供应商的标题以及该供应商 ID 的所有发票的总和；然后在其下方显示每张单独的发票。该项目的目标是导入 CSV、向用户显示数据、允许通过选择框更改某些值，然后单击按钮导出到 XML。 XML 的结构与 HTML 类似，每组发票首先显示某些通用数据，然后是汇款数据。为了实现这一点，我尝试以某种方式构建对象，以帮助我使用此方法将其正确转换为 XMLhttp://goessner.net/download/prj/jsonxml/ http://goessner.net/download/prj/jsonxml/ .

问题：后两笔付款需要分组在一起，我希望为每行详细数据创建一个数组，然后将其添加到主对象的 PmtDetail 属性中。目前，此代码仅广告第一行并忽略其余行。

CSV 片段（我不包括此处代码中使用的所有行）

 ID         CardCode   payment_sum    amount     
 1610165    BENV5271    100            100 
 1609026    BENV5635    509.85         287.33
 1609025    BENV5635    509.85         222.52 

JSON

 [{"DocNum":"1610165","CardCode":"BENV5271","InvPayAmnt":"100.00","PmntDate":"2012-03-29","payment_sum":"100.00"},
 {"DocNum":"1609026","CardCode":"BENV5635","InvPayAmnt":"287.33","PmntDate":"2012-03-29","payment_sum":"509.85"},  
 {"DocNum":"1609025","CardCode":"BENV5635","InvPayAmnt":"222.52","PmntDate":"2012-03-29","payment_sum":"509.85"}]

Jquery

 $(document).ready(function() {
    $.getJSON('CSV.php', function(data) {

    var prevCardCode = '';
    var newDiv; var NewDiv2;
var PaymentFormat;

    $.each(data, function(index, element) { //looping once to display header info such as sum
        XMLObject = []; // Creating a new object for each row     

        if (element['CardCode'] != prevCardCode) {

            XMLObject.Vendor_Sum = element['payment_sum'];
            XMLObject.Name1 = element['CardName'];
            XMLObject.Addr1 = element['Address'];

            console.log(XMLObject);

            newDiv = $('<div/>').addClass('row').appendTo('#showdata');
            $('<div class="sum_field">' + 'Total: ' + element['payment_sum'] + '</div>').appendTo(newDiv);

                $('<div class="options">Payment Format: <select name="Payment_Format" id="Payment_Format"><option value="CTX" selected="selected">Company to Company</option><option value="PPD">Company to Person</option></select> </div><div id="Selected_Format"></div>').appendTo(newDiv);

                XMLObject.paymentFormat = $('select#Payment_Format').val();;

                $('select#Payment_Format').change(function(){
                    PaymentFormat = $(this).val();
                    XMLObject.paymentFormat = PaymentFormat;
                });

        }

        newDiv2 = $('<div/>').addClass('sub_row').appendTo(newDiv);

        prevCardCode = element['CardCode'];

        $.each(element, function(key, value) { looping 2nd time to display the detail info
            XMLObjectDetail = {};   // Creating an array for each row of detail info

            XMLObjectDetail['TotalCurAmount'] = element['InvPayAmnt']; 
            XMLObjectDetail['NetCurAmount'] = element['InvPayAmnt'];

                   $('<div class="field">' + value + '</div>').appendTo(newDiv2);
                   XMLObject.PmtDetail =  XMLObjectDetail;
             });      
         });
     });
  });

PHP

 <?php 
  if (($handle = fopen('upload/BEN-new.csv', "r")) === FALSE) {
    die('Error opening file'); 
 }

 $headers = fgetcsv($handle, 1024, ',');
 $complete = array();

while ($row = fgetcsv($handle, 1024, ",")) {
       $complete[] = array_combine($headers, $row);
}
    fclose($handle);

    echo json_encode($complete);

?>

一些想法：

• $.each(data, ... //looping once to display header info such as sum你没有在任何地方创建一个总和。此外，这是唯一一个迭代所有的循环data rows.
• XMLObject = []; // Creating a new object for each row- 不，你正在创建一个数组。你真的应该创建一个对象（{})，因为你将它用作对象。
• XMLObject =...。你缺少一个var关键字在这里。每次迭代都会创建一个新对象，但将每个对象分配给同一个全局变量。这就是原因#Payment_Format更改处理程序只会更改最后创建的对象的格式 - 当前由“引用的对象”XMLObject".
• $('...<select name="Payment_Format" id="Payment_Format">...')您正在创建一个选择id每次迭代。你认为 id 如何是唯一的？这也是为什么('select#Payment_Format')将不选择当前迭代中创建的元素。
• $.each(element... looping 2nd time to display the detail info不。这不是第二个循环，而是一个将迭代当前属性的循环element- 循环将应用于每个迭代data-rows.
• XMLObjectDetail = {}; // Creating an array for each row of detail info- 不，你正在创建一个对象。再说一次，你错过了var关键词。
• (edit) XMLObject.PmtDetail = XMLObjectDetail;- 您在此处的元素的每次迭代中都会覆盖“PmtDetail”属性。那不应该是您附加到的数组吗？
• 在循环代码的末尾你有一个XMLObject，包含有关当前行的数据。您不想用它做一些事情，例如将其推送到行对象数组上吗？

好吧，我想现在我已经得到了你想要达到的目标。合适的结构可能是：

[ {
    "CardCode":"BENV5271"
    "details": [ {
        "DocNum": "1610165",
        "InvPayAmnt": "100.00",
        "PmntDate": "2012-03-29"
      } ],
     "payment_sum": "100.00"
   }, {
     "CardCode": "BENV5635",
     "details": [ {
         "DocNum": "1609026"  
         "InvPayAmnt": "287.33",
         "PmntDate": "2012-03-29"
       }, {
         "DocNum": "1609025",
         "InvPayAmnt": "222.52",
         "PmntDate": "2012-03-29"
       } ],
     "payment_sum": "509.85"
    } ]

或者相同，就像 id 的对象（键值映射）一样：

{
    "BENV5271" : {
        "details": {
            "1610165": {
                 "InvPayAmnt": "100.00",
                 "PmntDate": "2012-03-29"
             }
         }
         "payment_sum": "100.00"
     },
     "BENV5635": {
         "details": {
             "1609026": {
                 "InvPayAmnt": "287.33",
                 "PmntDate": "2012-03-29"
             },
             "1609025": {
                 "InvPayAmnt": "222.52",
                 "PmntDate": "2012-03-29"
             }
        },
        "payment_sum": "509.85"
    }
}

您还可以使用 JSON 的数字类型来表示数字值，而不是字符串:-) 您应该立即从数据库创建该结构。正如您所看到的，CSV 并不是它的最佳表示形式，并且由于 JSON 和 XML 能够表示它，因此您不应该使用 SQL->CSV->JSON(table)->JSON(结构化)->XML 而是 SQL- >JSON（结构化）->XML，甚至更好的是 SQL->XML。您可以使用 Ajax 轻松读取 XML 并在 JavaScript 中更改其 DOM。

如果您确实需要在 JS 中将格式错误的对象重组为良好的结构，则代码如下：

var cards = {}; // an object indexed by the CardCodes;
for (var i=0; i<data.length; i++) { // loop through the received JSON
    // data[i] equals the "element" variable from your code
    var code = data[i].CardCode;
    if (! code in cards) { // there is no card with that code
        cards[code] = {
            vendorSum: data[i].payment_sum,
            name: data[i].CardName,
            addr: data[i].Address,
            ...
            pmtDetail: [] // create array for the details
        };
    } // else: element already created
    cards[code].pmtDetail.push({
        docNum: data[i].DocNum, 
        amount: data[i].InvPayAmnt
        ...
    }); // adds a new detail object to the array
}