URLにJSONからIDを通過する間、未定義の値は

Question

を渡さなっているの下に与えられたとして、私はサンプルJSONをしました：

[ 
    { 
     "componentid": 4, 
     "displayImageUrl": "https://via.placeholder.com/350x200", 
     "title": "theme", 
     "shortdesc": "to set theme for different applications" 
    }, 
    { 
     "componentid": 7, 
     "displayImageUrl": "https://via.placeholder.com/350x200", 
     "title": "preferences", 
     "shortdesc": "preferences screen for apps" 
    } 
] 

そして、私はそのデータに基づいてHTMLコンテンツを用意しました。

function prepareTopComponentList(data) { 

    var preparedHtml = ""; 

    for (var count = 0; count < data.length; count++) { 
     preparedHtml += "<div class=\"col-lg-4\" style=\"margin-top: 20px\">\n" + 
      "    <div class=\"card wow fadeIn\" data-wow-delay=\"0.2s\">\n" + 
      "     <img class=\"img-fluid\" src=\""; 
     preparedHtml += data[0].displayImageUrl; 
     preparedHtml += "\" alt=\"N/A\">\n" + 
      "     <div class=\"card-body\">\n" + 
      "      <h4 class=\"card-title\">"; 
     preparedHtml += data[0].title; 
     preparedHtml += "</h4>\n" + 
      "      <p class=\"card-text\">"; 
     preparedHtml += data[0].shortdesc; 
     preparedHtml += "</p>\n" + 
      "      <a onclick = \"redirect(this, this);\" href='#' class=\"btn btn-info\" id=\""; 
     preparedHtml += "component_desc_" + data[count].componentid; 

     /*I replaced 0 with count so that we can get proper ids*/ 
     //console.log(data[0].componentid); 

     preparedHtml += "\">Learn more</a>\n" + 
      "     </div>\n" + 
      "\n" + 
      "    </div>\n" + 
      "   </div>"; 
    } 

    $("#div_top_component").append(preparedHtml); 

} 

は今、私はcomponentidの値に基づいて、ページにリダイレクトしています。コードは以下の通りです。私はこのコードを実行すると、私はこのエラーを取得する

function redirect(element, data) {   
    // data = prepareTopComponentList(data); 
    for (var count = 0; count < data.length; count++) { 
     var url = "inside.dell.com"; 
     var query = data[count].componentid; 
     var finalUrl = "inside.dell.com/componentid=" + query; 
     console.log(finalUrl); 
    } 
    window.location = "inside.dell.com/componentid=" + query; 
} 

：リダイレクション機能コードは以下のとおりである

The requested URL /Reusable Components/pages/inside.dell.com/componentid=undefined was not found on this server. 

というエラーが細かいですが、私はそれで問題ありません。ただし、リダイレクトURLでは、コンポーネントIDはundefinedです。コンポーネントIDの値がURLに渡されることを確認するにはどうすればよいですか？

Answer 1

あなたのHTMLで

その後、

"<a onclick = \"redirect(" + data[count].componentid + ");\" href='#' class=\"btn btn-info\" id=\""; 

そして、あなたの機能

function redirect(id) { 
    window.location = "inside.dell.com/componentid=" + id; 
} 

Answer 2

windows.locationに使用される変数queryは、forループブロックで定義されているため、その外側では定義されていません。

Answer 3

forループの外であなたのquery変数を宣言します。

function redirect(element, data) { 
// data = prepareTopComponentList(data); 
var query; 
for (var count = 0; count < data.length; count++) { 
    var url = "inside.dell.com"; 
    query = data[count].componentid; 
    var finalUrl = "inside.dell.com/componentid=" + query; 
    console.log(finalUrl); 
} 
window.location = "inside.dell.com/componentid=" + query; 
}