Json 배열에서 HTML 테이블로 특정 수의 행만 출력

Question

이것은 설명하기 어려울 수도 있지만 최선을 다할 것입니다.

두 개의 데이터베이스가 있습니다. 하나는 국가 이름이고 다른 하나는 운동 선수 이름입니다.

$sql="SELECT Cyclist.name, Country.ISO_id, Country.total, Country.gold, Country.silver, Country.bronze, Country.country_name 
FROM Country JOIN Cyclist ON Country.ISO_id=Cyclist.ISO_id 
WHERE Country.ISO_id = 'JPN' OR Country.ISO_id = 'USA' "; 

: 이 두 테이블은 국가 ID 인 속성 ISO_id (즉, FRA, JPN, 미국 등)

나는 다음과 같은 SQL 문이 두 테이블을 조인하고 의해 연결되어

미국의 경우 하나, 일본의 경우 하나만 국가 속성 만 표시하는 두 행의 표를 인쇄하려고합니다. 나중에 버튼을 클릭하면 국가의 모든 자전거를 보여주는 표를 만들기 위해 자전거 속성이 필요할 것입니다.

국가의 특성을 인쇄 할 때 국가의 운동 선수 수만큼 HTML 표에 넣어집니다. 미국에 15 명의 선수가 있다면 country 테이블은 미국 국가 특성의 15 배를 표시합니다.

어떻게 해결할 수 있습니까?

내 JS 코드 :

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script> 
<script type="text/javascript"> 
    var textArr='<?php echo $rowsArr?>'; // php write into javascript, as jsontext 
    $(document).ready(function(){ 
     var jsonArr = JSON.parse(textArr); //make jsontext into json array 
     var tr; 
     for(var i = 0; i < jsonArr.length; i++) { //there will be more countries, so i cant hardcode 2 as the loop end 
      tr = $('<tr/>'); 
      tr.append("<td>" + jsonArr[i].country_name + "</td>"); 
      tr.append("<td>" + jsonArr[i].ISO_id + "</td>"); 
      tr.append("<td>" + jsonArr[i].gold + "</td>"); 
      tr.append("<td>" + jsonArr[i].silver + "</td>"); 
      tr.append("<td>" + jsonArr[i].bronze + "</td>"); 
      tr.append("<td>" + jsonArr[i].total + "</td>"); 
      $('table').append(tr);//appending to html table 

     } 
    }); 
</script> 

내 HTML 코드

<table style="border: 1px solid black"> 
       <tr> 
        <th>Country name</th> 
        <th>Country ID</th> 
        <th>Gold Medals</th> 
        <th>Silver Medals</th> 
        <th>Bronze Medals</th> 
        <th>Total Medals</th> 
       </tr>   
      </table> 

Answer 1

나는 당신이 당신의 문제에 대한 두 가지 쿼리 프로그램을 더는 생각 - 선수에게 국가에 대한 쿼리 및 기타 - 때문에 메인 테이블은 국가를위한 것입니다.

GROUP BY 쿼리를 사용해보십시오.

$sql="SELECT Cyclist.name, Country.ISO_id, Country.total, Country.gold, Country.silver, Country.bronze, Country.country_name 
FROM Country JOIN Cyclist ON Country.ISO_id=Cyclist.ISO_id 
WHERE Country.ISO_id = 'JPN' OR Country.ISO_id = 'USA' GROUP BY Country.ISO_id"; 

편집

아, 나는 왜 프로그램이 쿼리를 설명하는 것을 잊었다. 이 문제에 대해 생각해보십시오 : 쿼리를 통해 두 행만 제공하고이 후에 모든 선수 이름을 얻고 싶습니다. 나는 그것이 성취 될 수 없다고 생각한다. 동의하니? 그러나이 나라의 정보를 정기적으로 참가하는 모든 선수 이름을 얻을 수 있습니다 :

$sql="SELECT Cyclist.name, Country.ISO_id, Country.total, Country.gold, Country.silver, Country.bronze, Country.country_name 
    FROM Cyclist LEFT JOIN Country ON Country.ISO_id=Cyclist.ISO_id 
    WHERE Country.ISO_id = 'JPN' OR Country.ISO_id = 'USA'"; 

그리고, 물론, 그 두 행되지 않습니다.

Answer 2

국가 테이블에 이미 각 국가에서 획득 한 각 유형의 메달이 몇 개 포함되어 있으므로 사이클 테이블과 결합 할 이유가 없습니다.

귀하의 JOIN은 이미 말씀 드렸듯이 국가마다 각 사이클리스트의 총 메달 수를 반복합니다.

당신의 쿼리를 대신해야한다 :

SELECT 
    Country.ISO_id, 
    Country.total, 
    Country.gold, 
    Country.silver, 
    Country.bronze, 
    Country.country_name 
FROM Country 
WHERE Country.ISO_id = 'JPN' OR Country.ISO_id = 'USA' 

그리고 테이블이 더 이상 자전거 타는 사람 이름에 대한 열이 안된다.

<table style="border: 1px solid black"> 
      <tr> 
       <th>Country name</th> 
       <th>Country ID</th> 
       <th>Gold Medals</th> 
       <th>Silver Medals</th> 
       <th>Bronze Medals</th> 
       <th>Total Medals</th> 
       <th>Athlete Name</th> 
      </tr>   
     </table> 

Answer 3

간단한 해결책, 각 반복에 대해 다음 당신이 마지막으로 국가로 사용되는 것을 테스트하는 것입니다 :

for(var i = 0; i < jsonArr.length; i++) { 
     tr = $('<tr/>'); 
     tr.append("<td>" + jsonArr[i].country_name + "</td>"); 
     tr.append("<td>" + jsonArr[i].ISO_id + "</td>"); 
     tr.append("<td>" + jsonArr[i].gold + "</td>"); 
     tr.append("<td>" + jsonArr[i].silver + "</td>"); 
     tr.append("<td>" + jsonArr[i].bronze + "</td>"); 
     tr.append("<td>" + jsonArr[i].total + "</td>"); 
     $('table').append(tr);//appending to html table 
    } 

(P와 당신은뿐만 아니라 테이블 머리글에서 열이 말했다 제거해야합니다) 카운티에서는 테이블의 국가 및 ISO 열에 대해 빈 셀만 출력합니다.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script> 
<script type="text/javascript"> 
    var textArr='<?php echo $rowsArr?>'; // php write into javascript, as jsontext 
    $(document).ready(function(){ 
     var jsonArr = JSON.parse(textArr); //make jsontext into json array 
     var tr; 
     var last_ctry = ''; 
     for(var i = 0; i < jsonArr.length; i++) { //there will be more countries, so i cant hardcode 2 as the loop end 

      tr = $('<tr/>'); 
      if (last_ctry != jsonArr[i].country_name) { 
       tr.append("<td>" + jsonArr[i].country_name + "</td>"); 
       tr.append("<td>" + jsonArr[i].ISO_id + "</td>"); 
       last_ctry = jsonArr[i].country_name; 
      } else { 
       tr.append("<td>&nbsp;</td>"); 
       tr.append("<td>&nbsp;</td>"); 
      } 

      tr.append("<td>" + jsonArr[i].gold + "</td>"); 
      tr.append("<td>" + jsonArr[i].silver + "</td>"); 
      tr.append("<td>" + jsonArr[i].bronze + "</td>"); 
      tr.append("<td>" + jsonArr[i].total + "</td>"); 
      tr.append("<td>" + jsonArr[i].name + "</td>"); 
      $('table').append(tr);//appending to html table 

     } 
    }); 
</script>