2012-09-24 2 views
0

나는 물마루 배열을 반복하고 그 결과를 HTML 테이블에 표시하려고합니다. 데이터는 웹 서비스에서 가져옵니다.여물 JSON 배열을 반복하고 결과를 HTML 테이블에 표시

내 자바 스크립트 기능 :

function loadDate() { 

     var PanelID = document.getElementById('PanelID').value; 
     alert(PanelID); 


     $.ajax({ 
      type: "POST", 
      url: "../../WebService/QRCode.asmx/getDatetime", 
      data: "{ 'PanelID': '" + PanelID + "' }", 
      contentType: "application/json; charset=utf-8", 
      dataType: "json", 
      async: false, 
      cache: true, 
      success: function(data) { 

       var table = document.createElement('table'); 
       var str = '<table>'; 
       str += '<tr><th>Von</th><th>Bis</th><th>Thema</th></tr>'; 

       for(var i = 0; i < data.d.length; i++) { 

        str += '<tr><td>' + data.d[i].Von + '</td><td>' + data.d[i].Bis + '</td><td>' + data.d[i].Thema + '</td></tr>'; 


       } 
       str += '</table>'; 
       return str; 


       var existingDiv = document.getElementById('DataTable'); 
       existingDiv.innerHTML = loadDate(data); 

      }, 
      error: function(x, e) { 
       alert("The call to the server side failed. " + x.responseText); 
      } 
     }); 

    } 

HTML 파트

<body> 
    <h1> 
     Check-In und Check-Out von Besprechungen</h1> 

    <form id="form1" runat="server"> 
    <div id = "DataTable"> </div> 
    <p> 
     <asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server"> 
     </asp:ToolkitScriptManager> 
     Raumname: 
     <br /> 
     <asp:TextBox type="text" name="Panels" ID="PanelID" value="" runat="server"></asp:TextBox> 
     <br /> 
     <br /> 
     <asp:TextBox type="text" ID="Table" mode="multiline" runat="server" Coloumns="100" Rows="200" 
      Height="230px" Width="405px"></asp:TextBox> 


     <br /> 
     <br /> 
     <asp:Button ID="button" runat="server" Text="Check-In" Width="99px" OnClientClick="return loadDate();" /> 
     <asp:Button ID="button1" runat="server" Text="Check_Out" Width="99px" /> 
    </p> 
    </form> 
</body> 

문제는 뭔가가 내 코드에서 작동하지 않는 것입니다. 위의 코드를 사용하면 값을 표시 할 수 없습니다.

for(var i = 0; i < data.d.length; i++) { 
        var VonDatum = data.d[i].Von; 
        $("#Table").val(VonDatum); 
} 

그래서 내가 텍스트 상자에 폰 값을 표시 할 수 있습니다 내가 예를 들어 FOR 절을 변경 f를

때문에

나는,이 조항에 대한 지혜를 할 수있는 뭔가가 생각합니다. 하지만 FOR 절이 하나의 값만 표시하고 배열에는 30 개 이상의 값이있는 것이 좋습니다.

{"d":[{"Von":"18.05.2012 00:00:00","Bis":"18.06.2012 00:00:00","Thema":"Raum ist gesperrt","PanelIDs":"FAT-1"}]} 

누군가가 나를 도울 수 :

내 JSON-데이터처럼 보인다?

+0

json 데이터는 어떻게 생겼습니까? –

+0

나는 내 질문을 편집했습니다. – Paks

답변

1

OLD해야

return str; 

var existingDiv = document.getElementById('DataTable'); 
existingDiv.innerHTML = loadDate(data); 

NEW

var existingDiv = document.getElementById('DataTable'); 
existingDiv.innerHTML = loadDate(data); 

return str; 

하지만 str이 모든 요소는 요소을 설정하려는 그래서 설정되어 있지? 이렇게하면

var existingDiv = document.getElementById('DataTable'); 
    existingDiv.innerHTML = str; 
+0

안녕하세요, 지금까지 일해 줘서 고마워. 그는 데이터로 표를로드하지만 2 초 후에 표가 사라집니다. 그 이상한 – Paks

+0

+1하고 대답을 잊지 마세요. – Sender

+0

아마도 2 초 후에 테이블이 사라지는 원인을 알 수 있습니까? – Paks

0

은 왜

return str; 

어디 당신이 그것을 반환하는해야합니까? 코드는

existingDiv.innerHTML = loadDate(str); 
관련 문제