2016-07-31 72 views
3

我有一个JSON文件。我必须在这个文件中读取JSON文件WinType是该字段中的两个值提名和赢的字段。我必须将此值安排在表格中,如1 = Win和0 =提名。但有一段时间,如果记录没有发现在json文件中,我想<td> </td>空白。所以,我的表显示如下如何使用JSON显示表中的空白记录?

<html> 
<body> 
    <TABLE BORDER=2 BORDERCOLOR=RED> 
     <TR> 
      <TD>12 Years a Slave</TD> 
      <TD>1</TD> 
      <TD></TD> 
      <TD>0</TD> 
     </TR> 

     <TR> 
      <TD>American Hustle</TD> 
      <TD>0</TD> 
      <TD>0</TD> 
      <TD>1</TD> 
     </TR> 

     <TR> 
      <TD>Captain Phillips</TD> 
      <TD></TD> 
      <TD>0</TD> 
      <TD>1</TD> 
     </TR> 
    </TABLE> 
</body> 
</html> 

我的JSON文件是:

[{ 
    "ID": 1, 
    "Nominee": "12 Years a Slave", 
    "WinProbability": 0.00, 
    "WinType": "Win" 
}, { 
    "ID": 3, 
    "Nominee": "12 Years a Slave", 
    "WinProbability": 0.66, 
    "WinType": "Nominated" 
}, { 
    "ID": 1, 
    "Nominee": "American Hustle", 
    "WinProbability": 1.62, 
    "WinType": "Nominated" 
}, { 
    "ID": 2, 
    "Nominee": "American Hustle", 
    "WinProbability": 0.85, 
    "WinType": "Win" 
}, { 
    "ID": 3, 
    "Nominee": "American Hustle", 
    "WinProbability": 0.07, 
    "WinType": "Win" 
}, { 
    "ID": 2, 
    "Nominee": "Captain Phillips", 
    "WinProbability": 0.00, 
    "WinType": "Win" 
}, { 
    "ID": 3, 
    "Nominee": "Captain Phillips", 
    "WinProbability": 1.52, 
    "WinType": "Win" 
}] 

我试过,但不能正常工作。

尝试代码:

$.ajax({ 
    url: 'movie.json', 
    dataType: 'json', 

    success: function(data) { 
     var groupByNominee = data.reduce(function(rv, x) { 
      (rv[x['Nominee']] = rv[x['Nominee']] || []).push(x); 
      return rv; 
     }, {}); 

     $(Object.keys(groupByNominee).map((nom) => 
      `<TR> 
       <TD>${nom}</TD> 
       ${groupByNominee[nom].map((item)=> 
         `<TD> 
          ${(item.WinType==='Win')?1:0} 
         </TD>` 
        ).join('') 
       } 

      </TR>` 
      ).join('')).appendTo('#Table'); 
    } 
}); 
+0

你能解释一下你找不到记录吗?你在谈论一个缺失的属性?您发布的示例JSON似乎没有遗漏任何会导致您正在寻找空白条件的内容。 –

+0

@劳伦斯约翰逊如果在表td中缺少属性空白 –

+0

@劳伦斯约翰逊在我的尝试代码比较代名词但不匹配ID –

回答

1

假设你刚刚只是可能丢失WinType属性,试试这个:

$.ajax({ 
    url: 'movie.json', 
    dataType: 'json', 

    success: function(data) { 
     var groupByNominee = data.reduce(function(rv, x) { 
      (rv[x['Nominee']] = rv[x['Nominee']] || []).push(x); 
      return rv; 
     }, {}); 

     $(Object.keys(groupByNominee).map((nom) => 
      `<TR> 
       <TD>${nom}</TD> 
       ${groupByNominee[nom].map((item)=> 
         `<TD> 
          ${(typeof(item.WinType) !== 'undefined' && item.WinType.length > 0) ? (item.WinType === 'Win' ? '1' : '0') : ''} 
         </TD>` 
        ).join('') 
       } 

      </TR>` 
      ).join('')).appendTo('#Table'); 
    } 
}); 

这应该检查WinType属性存在,它的长度(如果找到)是在检查它是否等于Win之前大于0。

+0

但td不显示空白https://jsfiddle.net/abdennour/4vg2broh/ –

+0

如果“代名人”:“12年从”为ID = 2没有在JSON文件中找到,那么我的TR这个样子的​​1​​​​0 –

+0

我不明白这一点。它在你的JSON中显示了12年的两个从属条目,它们都具有WinType值 –

0

我想这是你想要什么:

 
Nominee   "ID":1 "ID":2 "ID":3 
12 Years a Slave 1     0 
American Hustle  0   1  1 
Captain Phillips    1  1 

那么你需要一个参照组,如[1,2,3] 这段代码只是为了显示缺少的一部分,而不是优雅,但工程:

function (data){ 
    var groupByNominee=data.reduce(function(rv, x) { 
    (rv[x['Nominee']] = rv[x['Nominee']] || []).push(x); 
    return rv; 
    }, {}); 
    var ids = [1,2,3]; 


    $(Object.keys(groupByNominee).map((nom)=>{ 
    var str = '<TR>'; 
    str += '<TD>'+ nom + '</TD>' 

    var ids=[1,2,3]; //Need all IDs 
    var mid = ids.map((id)=>{ // then loop all ids to get the empty id displayed. 
     var type = ""; 
     groupByNominee[nom].forEach((item)=>{ 
     if (item.ID == id){ 
      type = (item.WinType==='Win')?'1':'0' ; 
     } 
     }); 
     return '<td>'+type+'</td>'; 
    }).join(''); 
    str += mid; 
    str += '</TR>'; 
    return str; 
    } 
    ).join('')).appendTo('#Table'); 

}