2016-11-22 43 views
0

我想添加一个头到这个JSON输出表,但我不知道如何做到这一点。此代码为我提供了一个表格,其中填充了从数据库返回的数据,并将其以<td><tr>标签所构建的表格格式存储。问题是我需要一个表头,我不知道如何得到该部分编码。有任何想法吗?如何将标题添加到我的JSON输出表中?

function renderSearchResults(results, domNode) { 
    var i; 
    var out = "<table>"; 

    if (results.length === 0) { 
     domNode.innerHTML = 'No results matching your search.'; 
     return; 
    } 
    // loop to print the JSON in a table format 
    results.forEach(function (result) { 
     console.info(result); 
     out += "<tr><td>" + 
     result.ContractId + 
     "</td><td>" + 
     result.ContractTitle + 
     "</td><td>" + 
     result.Terminal + 
     "</td><td>" + 
     result.Cabinet + 
     "</td><td>" + 
     result.Section + 
     "</td><td>" + 
     result.Folder + 
     "</td><td>" + 
     result.Sheet + 
     "</td><td>" + 
     result.Consult + 
     "</td><td>" + 
     result.Location + 
     "</td><td>" + 
     result.Active + 
     "</td><td>" + 
     result.Theme + 
     "</td><td>" + 
     result.Construction + 
     "</td><td>" + 
     result.Subtheme + 
     "</td><td>" + 
     result.AsBuilt + 
     "</td><td>" + 
     result.Year + 
     "</td><td>" + 
     "<a href= " + result.Path + " target=_blank>" + "Binder" + "</a>" 
    }); 

    out += "</table>"; 
    domNode.innerHTML = out; 
} 

回答

1

在你的out最初的声明中,您可以把<th>或tableHeader为标签,即:

function renderSearchResults(results, domNode) { 
     var i; 
     var out = "<table><th>ContractId</th><th>ContractTitle</th><th>Terminal</th><th>Cabinet </th><th>Section </th><th>Folder </th><th>Sheet </th><th>Consult </th><th>Location </th><th>Active </th><th>Theme </th><th>Construction </th><th>Subtheme </th><th>AsBuilt </th><th>Year </th>"; 

     if (results.length === 0) { 
      domNode.innerHTML = 'No results matching your search.'; 
      return; 
     } 

     results.forEach(function (result) { 
     console.info(result); 
     out += "<tr><td>" + 
     (result.ContractId !== null ? result.ContractId : 'Not Applicable') + 
     "</td><td>" + 
     (result.ContractTitle !== null ? result.ContractTitle : 'Not Applicable') + 
     "</td><td>" + 
     (result.Terminal !== null ? result.Terminal : 'Not Applicable') + 
     "</td><td>" + 
     (result.Cabinet !== null ? result.Cabinet : 'Not Applicable') + 
     "</td><td>" + 
     (result.Section !== null ? result.Section : 'Not Applicable') + 
     "</td><td>" + 
     (result.Folder !== null ? result.Folder : 'Not Applicable') + 
     "</td><td>" + 
     (result.Sheet !== null ? result.Sheet : 'Not Applicable') + 
     "</td><td>" + 
     (result.Consult !== null ? result.Consult : 'Not Applicable') + 
     "</td><td>" + 
     (result.Location !== null ? result.Location : 'Not Applicable') + 
     "</td><td>" + 
     (result.Active !== null ? result.Active : 'Not Applicable') + 
     "</td><td>" + 
     (result.Theme !== null ? result.Theme : 'Not Applicable') + 
     "</td><td>" + 
     (result.Construction !== null ? result.Construction : 'Not Applicable') + 
     "</td><td>" + 
     (result.Subtheme !== null ? result.Subtheme : 'Not Applicable') + 
     "</td><td>" + 
     (result.AsBuilt !== null ? result.AsBuilt: 'Not Applicable') + 
     "</td><td>" + 
     (result.Year !== null ? result.Year : 'Not Applicable')+ 
     "</td><td>" + 
     "<a href= " + result.Path + " target=_blank>" + "Binder" + "</a>" 
    }); 

     out += "</table>"; 
     console.log(out); 
     domNode.innerHTML = out; 
    } 
+0

谢谢,但没有工作。 – alast

+0

他忘了添加''标签,这应该可以工作 – Kiogara

+0

我认为''标签可以独立运行,但我想知道OP是否在为每个单独的表行寻找标题? –

0

表格标题有一个不同的标签。

<tr>是针对您的标题的行<th>和针对数据的<td>

您可以检查here获取更多信息。

您可以您的支票后,添加页眉的结果:

if (results.length === 0) { 
     domNode.innerHTML = 'No results matching your search.'; 
     return; 
} else { 
    out += "<tr><th>Header</th></tr>" 
} 
+0

你是什么意思? 标记?我的问题是,我不能在我的JS代码中包含它。因为它循环并在每行之前添加一个标题。 – alast

+1

您可以在循环之前添加,因为您没有使用else语句。 – Kiogara

+0

感谢Pernambuco!其解决。 :) – alast

相关问题