如何在javascript中检索数组内的数组?

Posted

技术标签:

【中文标题】如何在javascript中检索数组内的数组?【英文标题】:How to retrieve array inside array in javascript? 【发布时间】:2021-10-22 20:41:12 【问题描述】:

这是我的 Json 数组。我想检索子数组,我需要在项目部分下显示所有发票详细信息。请检查随附的屏幕截图。在屏幕截图中,您只能看到仅显示给所有其他项目的最后一张发票详细信息。最后一张发票编号 1005 显示给所有人。如何根据项目详细信息显示发票详细信息?

当子行为空时,项目详细信息(父)也不显示。我正在获取 projectinvoicesection: [] Array 0。我需要显示项目详细信息,但在发票部分找不到记录。但现在数组为零。

[
    "parent": 
      "project_ID": "1",
      "project_title": "Network and Telephone Points",
      "particulars": "Test Description",
      "project_amount": "10000.00",
      "type": "One Time",
    ,
    "child": [
      "invoice_No": "1002",
      "received_Amt": "0.00",
      "invoice_amount": "472.50",
      "proje_ID": "1",
      "invoice_Date": "2021-08-31"
    ]
  ,
  
    "parent": 
      "project_ID": "2",
      "project_title": "Configuration and Programming",
      "particulars": "test description",
      "project_amount": "2000.00",
      "type": "One Time",
      "period_type": " ",
    ,
    "child": [
      "invoice_No": "1004",
      "received_Amt": "0.00",
      "invoice_amount": "245.70",
      "proje_ID": "2",
      "invoice_Date": "2021-08-30"
    ]
  ,
  
    "parent": 
      "project_ID": "3",
      "project_title": "Coffee ERP",
      "particulars": "test",
      "project_amount": "50000.00",
      "type": "One Time",
      "period_type": " ",
    ,
    "child": [
        "invoice_No": "1000",
        "received_Amt": "0.00",
        "invoice_amount": "1820.70",
        "proje_ID": "3",
        "invoice_Date": "2021-08-19"
      ,
      
        "invoice_No": "1001",
        "received_Amt": "0.00",
        "invoice_amount": "1773.45",
        "proje_ID": "3",
        "invoice_Date": "2021-08-24"
      
    ]
  ,
  
    "parent": 
      "project_ID": "6",
      "project_title": "sample project new design",
      "particulars": "Test Project new",
      "project_amount": "4000.00",
      "type": "One Time",
      "period_type": " ",
    ,
    "child": [
      "invoice_No": "1005",
      "received_Amt": "0.00",
      "invoice_amount": "283.50",
      "proje_ID": "6",
      "invoice_Date": "2021-08-21"
    ]
  
]

我已经尝试过以下代码:

for (var i = 0; i < new_data.projectinvoicesection.length; i++) 
  var sl = i + 1;

  //alert(t6)                   

  var t1 = new_data.projectinvoicesection[i]['parent'].project_amount;
  //alert(t1)
  var t2 = new_data.projectinvoicesection[i]['parent'].particulars;
  var t3 = new_data.projectinvoicesection[i]['parent'].project_ID;
  var t4 = new_data.projectinvoicesection[i]['parent'].project_title;
  var t5 = new_data.projectinvoicesection[i]['parent'].type;
  var t56 = new_data.projectinvoicesection[i]['parent'].period_type;

  var object = new_data.projectinvoicesection[i]['child'];

  var tr = "<tr data-toggle='collapse' data-target='#demo" + t3 + "' style='background-color: #337ab7;color: white;' class='accordion-toggle'><td>" + sl + "</td><td>" + t4 + "</td><td>" + t1 + "</td><td style='white-space: nowrap;'>" + t5 + " " + t56 + "</td><td><button class='open-button-project-edit btn' data-toggle='modal' data-backdrop='static' data-keyboard='false' data-target='#exampleModal_2' onclick='openForm3(" + t3 + ")' style='color: #fff;background-color: #398439;border-color: #255625;'>EDIT</button></td></tr><tr><td colspan='6' class='hiddenRow'><div class='accordian-bodyproj collapse' id='demo" + t3 + "'> <table id='tableinvoice_proj' class='tableinvoice_proj' style='border-collapse:collapse;'><thead><tr><th>Invoice Date</th><th>Invoice Number</th><th>Invoice Amount</th><th>Received Amount</th><th>Generate Receipt</th></tr></thead><tbody></tbody></table>";
  $("#tableproject").append(tr);
  $("#tableproject").append('</div></td></tr>');


for (var property in object) 
  //alert(object[property].invoice_No);
  var t6 = format(object[property].invoice_Date);
  var t7 = object[property].invoice_No;
  var t8 = object[property].invoice_amount;
  var t9 = object[property].received_Amt;
  var t10 = object[property].proje_ID; //invoice table's project id

  var trtoggle = "<tr><td>" + t6 + "</td><td>" + t7 + "</td><td>" + t8 + "</td><td class=''>" + t9 + "</td><td class=''><input type='checkbox' name='myTextEditBox' value='checked' /> checkbox</td></tr>";
  
  $(".tableinvoice_proj").append(trtoggle);


Here is the screenshot

php 模式:

 public function list_all_projects_invoice($data) //project section display with ALL Category
 
     $array_store = array();
foreach($this->one_allcategory($data) as $row) 
           $child = $this->many_allcategory($row['project_ID']);
           if($child)           
                $return = array_merge(array("parent" => $row), array("child" =>$child));               
                array_push($array_store, $return);                                              
              
        
        return $array_store;    


public function one_allcategory($data) 
        $query = $this->db->select("*")
        ->where("comp_ID", $data)
        ->get("project_details")
        ->result_array();
        return $query;
    

    public function many_allcategory($id) 
        $query = $this->db->select('invoice_No,received_Amt,invoice_amount,proje_ID,invoice_Date')        
        ->where("proje_ID", $id)
        ->get("invoice_details")
        ->result_array();
        return $query;
    

【问题讨论】:

我更新了我的答案,我展示了如何检查项目信息的空白 提示:one_allcategory 更专业地写成:public function one_allcategory(int $compId): array return $this-&gt;get_where("project_details", ["comp_ID", $compId])-&gt;result_array(); 也就是说,您的脚本正在迭代模型方法调用(这意味着对数据库的迭代之旅——这是一个禁忌。您应该创建一个单一的模型方法,该方法只使用一个使用连接的 sql 查询访问数据库。该结果集应该转换为您确切想要的数组结构并传递回控制器以传递给视图。跨度> 【参考方案1】:

这是因为您将trtoggle 附加到.tableinvoice_proj 而不指定该类的确切元素,然后将trtoggle 附加到具有.tableinvoice_proj 类的所有元素。

根据代码你可以试试

$(".tableinvoice_proj").last().append(trtoggle);

而不是

$(".tableinvoice_proj").append(trtoggle);

new_data = new Object();
new_data.projectinvoicesection = [
    "parent": 
      "project_ID": "1",
      "project_title": "Network and Telephone Points",
      "particulars": "Test Description",
      "project_amount": "10000.00",
      "type": "One Time",
    ,
    "child": [
      "invoice_No": "1002",
      "received_Amt": "0.00",
      "invoice_amount": "472.50",
      "proje_ID": "1",
      "invoice_Date": "2021-08-31"
    ]
  ,
  
    "parent": 
      "project_ID": "2",
      "project_title": "Configuration and Programming",
      "particulars": "test description",
      "project_amount": "2000.00",
      "type": "One Time",
      "period_type": " ",
    ,
    "child": [
      "invoice_No": "1004",
      "received_Amt": "0.00",
      "invoice_amount": "245.70",
      "proje_ID": "2",
      "invoice_Date": "2021-08-30"
    ]
  ,
  
    "parent": 
      "project_ID": "3",
      "project_title": "Coffee ERP",
      "particulars": "test",
      "project_amount": "50000.00",
      "type": "One Time",
      "period_type": " ",
    ,
    "child": [
        "invoice_No": "1000",
        "received_Amt": "0.00",
        "invoice_amount": "1820.70",
        "proje_ID": "3",
        "invoice_Date": "2021-08-19"
      ,
      
        "invoice_No": "1001",
        "received_Amt": "0.00",
        "invoice_amount": "1773.45",
        "proje_ID": "3",
        "invoice_Date": "2021-08-24"
      
    ]
  ,
  
    "parent": 
      "project_ID": "6",
      "project_title": "sample project new design",
      "particulars": "Test Project new",
      "project_amount": "4000.00",
      "type": "One Time",
      "period_type": " ",
    ,
    "child": [
      "invoice_No": "1005",
      "received_Amt": "0.00",
      "invoice_amount": "283.50",
      "proje_ID": "6",
      "invoice_Date": "2021-08-21"
    ]
  ,
  
    "parent": 
      "project_ID": "9",
      "project_title": "TEST",
      "particulars": "NO RESULT",
      "project_amount": "0",
      "type": "One Time",
      "period_type": " ",
    ,
    "child": []
  
]




for (var i = 0; i < new_data.projectinvoicesection.length; i++) 
    
    var sl = i + 1;

    //alert(t6)                   

    var t1 = new_data.projectinvoicesection[i]['parent'].project_amount;
    //alert(t1)
    var t2 = new_data.projectinvoicesection[i]['parent'].particulars;
    var t3 = new_data.projectinvoicesection[i]['parent'].project_ID;
    var t4 = new_data.projectinvoicesection[i]['parent'].project_title;
    var t5 = new_data.projectinvoicesection[i]['parent'].type;
    var t56 = new_data.projectinvoicesection[i]['parent'].period_type;

    var object = new_data.projectinvoicesection[i]['child'];

    var tr = "<tr data-toggle='collapse' data-target='#demo" + t3 + "' style='background-color: #337ab7;color: white;' class='accordion-toggle'><td>" + sl + "</td><td>" + t4 + "</td><td>" + t1 + "</td><td style='white-space: nowrap;'>" + t5 + " " + t56 + "</td><td><button class='open-button-project-edit btn' data-toggle='modal' data-backdrop='static' data-keyboard='false' data-target='#exampleModal_2' onclick='openForm3(" + t3 + ")' style='color: #fff;background-color: #398439;border-color: #255625;'>EDIT</button></td></tr><tr><td colspan='6' class='hiddenRow'><div class='accordian-bodyproj collapse' id='demo" + t3 + "'> <table id='tableinvoice_proj' class='tableinvoice_proj' style='border-collapse:collapse;'><thead><tr><th>Invoice Date</th><th>Invoice Number</th><th>Invoice Amount</th><th>Received Amount</th><th>Generate Receipt</th></tr></thead><tbody></tbody></table>";
    
    $("#tableproject").append(tr);
    $("#tableproject").append('</div></td></tr>');

    if( !object || object.length < 1)
    
        var trtoggle = `<tr ><td style='text-align:center;' colspan='5' > No records found!</td></tr>`;
     else
    
    var trtoggle = '';
        for ( var property in object ) 
            
            //alert(object[property].invoice_No);
            var t6 = object[property].invoice_Date;
            var t7 = object[property].invoice_No;
            var t8 = object[property].invoice_amount;
            var t9 = object[property].received_Amt;
            var t10 = object[property].proje_ID; //invoice table's project id

            trtoggle += "<tr><td>" + t6 + "</td><td>" + t7 + "</td><td>" + t8 + "</td><td class=''>" + t9 + "</td><td class=''><input type='checkbox' name='myTextEditBox' value='checked' /> checkbox</td></tr>";
        
        
        
    
  $(".tableinvoice_proj").last().append(trtoggle);
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table id="tableproject">
</table>

【讨论】:

请在新话题下提出新问题,让答案更清晰 我问了一个新问题,你能帮帮我吗?***.com/questions/68892623/… 如果收到的金额 == '0.00',如何禁用该复选框?我试图禁用该复选框但不起作用 if(Math.abs(t8) == Math.abs(t9)) $('.checkBoxClassse'+t11).removeAttr("disabled") 在最后一个 trtoggle 之前的循环中定义 var is_disabled = parseInt(t9) == 0 ? "disabled = true" : ""; 并将 is_disabled var 添加到您的最后一个 trtoggle 输入【参考方案2】:

您的第二个 for 循环需要在第一个 for 循环内(嵌套):

//You have
For()

For()


//You need
For()
    For()
    

【讨论】:

以上是关于如何在javascript中检索数组内的数组?的主要内容,如果未能解决你的问题,请参考以下文章

如何在Javascript中选择对象内的数组内的字段[重复]

如何在javascript中过滤数组内的嵌套对象

在Javascript中检索主题颜色数组

仅检索 javascript 数组的列

如何检查对象内的数组是不是为空 JavaScript

如何将所有 Meteor Mongo 集合名称检索为 Javascript 数组?