显示 JavaScript 数组时遇到问题


having trouble displaying javascript array

I hava php 文件,在 csv 文件中读取

`<?php
$csv = array_map('str_getcsv', file('../data/file.csv'));
array_walk($csv, function(&$a) use ($csv) {
    $a = array_combine($csv[0], $a);
});
array_shift($csv); # remove column header
header('Content-Type: application/json');
echo json_encode($csv);
?>`

我有js文件,在表格中显示名字,姓氏和一个按钮。 这行得通。比我单击按钮时,它应该将值传递到另一个页面。它仅适用于名字和姓氏。当我尝试从数据文件传递其他值时,表不显示。我需要能够将数据文件中的所有值传递给新的 php 文件 我做错了什么?有没有更简单的方法可以做到这一点?谢谢你,我真的很感谢你的帮助。

var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
  if (xhr.readyState === 4) {
    var file = JSON.parse(xhr.responseText);
    var statusHTML = '<tr>';
    for (var i = 0; i < file.length; i += 1) {
      statusHTML += '<td>';
      statusHTML += file[i].FirstName;
      statusHTML += '</td>';
      statusHTML += '<td>';
      statusHTML += file[i].LastName;
      statusHTML += '</td>';
      statusHTML += '<td>';
      statusHTML +='<form name="classesDisplay"role="form"  action="planer.php" method="post">';
      statusHTML +='<input type="hidden" name="firstname" value="'+file[i].FirstName+'">';
      statusHTML +='<input type="hidden" name="lastname" value="'+file[i].LastName+'">';
      //statusHTML +='<input type="hidden" name="calc1" value="'+file[i].MAT251-Calc-I +'">';
       statusHTML +='<button type="submit" class="btn btn-sm btn-success myButton">';
       statusHTML += '<span class="glyphicon glyphicon-eye-open"></span>';
       statusHTML +=' progress</button>'; 
      statusHTML +='</form>';      
      statusHTML += '</td>';
      statusHTML += '</tr>';

    }
    document.getElementById('studentList').innerHTML = statusHTML;
  }
};
xhr.open('GET', 'data/file.php');
xhr.send();

三宝数据

[
  {
    "LastName": "Rocha",
    "FirstName": "Cara I.",
    "MAT251-Calc-I": "A",
    "MAT252-Calc-II": 0,
    "MAT320-DiscreteMath": 0,
    "CPS210-CompSci-I": "C-",
    "CPS310-CompSci-II": 0,
    "CPS315-CompSci-III": 0,
    "CPS352-OOP": 0,
    "CPS330-Assembly.Arch.": 0,
    "CPS353-SoftEng": 0,
    "CPS415-Disc.Cont.Algorithms": 0,
    "CPS340-Op.Sys": 0,
    "CPS425-Lang.Processing": 0,
    "CPS493-Elect-1": 0,
    "CPS493-Projects": 0,
    "EGC230-Dig.Logic": 0,
    "EGC208-Dig.Logic.Lab": 0,
    "SCIENCE-I": 0,
    "SCIENCE-II": 0
  },
  {
    "LastName": "Hamilton",
    "FirstName": "Mufutau N.",
    "MAT251-Calc-I": 0,
    "MAT252-Calc-II": 0,
    "MAT320-DiscreteMath": 0,
    "CPS210-CompSci-I": "A-",
    "CPS310-CompSci-II": 0,
    "CPS315-CompSci-III": 0,
    "CPS352-OOP": 0,
    "CPS330-Assembly.Arch.": 0,
    "CPS353-SoftEng": 0,
    "CPS415-Disc.Cont.Algorithms": 0,
    "CPS340-Op.Sys": 0,
    "CPS425-Lang.Processing": 0,
    "CPS493-Elect-1": 0,
    "CPS493-Projects": 0,
    "EGC230-Dig.Logic": 0,
    "EGC208-Dig.Logic.Lab": 0,
    "SCIENCE-I": 0,
    "SCIENCE-II": 0
  },

您只为所有行创建一个起始<tr>,但正确关闭每一行

改变

var statusHTML = '<tr>';
for (var i = 0; i < file.length; i += 1) {

var statusHTML = '';
for (var i = 0; i < file.length; i += 1) {
  statusHTML  += '<tr>'; // start new row each iteration of loop

对于带有特殊字符的属性名称(如 file[i].MAT251-Calc-I),您需要使用[]表示法:

file[i]['MAT251-Calc-I']