2016-12-29 3 views
0

So generieren Sie die Tabelle für diesen JSON-Wert. Innerhalb der Ajax-Funktion Daten sind Print in der Konsole und auch in Jsp aber außerhalb des Wertes ist nicht definiert, was ist der Fehler?Wie in AJAX-Funktion JSON-Wert zu JSP-Seite verwenden?

<head> 
<title>Spring MVC Ajax Demo</title> 
<script type="text/javascript" 
src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> 
<script type="text/javascript"> 
function doAjax() { 
    var samp; 
    $.ajax({ 
     url : '/RoomController/ViewMember', 
     type : 'GET', 
     success : function(data) { 
      samp=data; 
      console.log(samp[0].memberName); 
      $('#json').html(samp[3].memberName); 
     } 
    }); 
    document.getElementById("memberList").value=samp; 
} 
</script> 
</head> 
<body> 
<button id="demo" onclick="doAjax()" title="Button">Get the 
    time!</button> 
<div id="time"> 
    <label id="json"></label> 
    <input type="hidden" id="memberList" name="memberList"> 
    <table> 
     <c:forEach items="${memberList}" var="firstname"> 
      <tr> 
       <td>${firstname.memberName}</td> 
      </tr> 
     </c:forEach> 

    </table> 

</div> 

Antwort

0

bereits. Hinweis: Diese verwendet JQuery

Javascript:

var myList = [{"name" : "abc", "age" : 50}, 
      {"age" : "25", "hobby" : "swimming"}, 
      {"name" : "xyz", "hobby" : "programming"}]; 

// Builds the HTML Table out of myList. 
function buildHtmlTable(selector) { 
    var columns = addAllColumnHeaders(myList, selector); 

for (var i = 0 ; i < myList.length ; i++) { 
    var row$ = $('<tr/>'); 
    for (var colIndex = 0 ; colIndex < columns.length ; colIndex++) { 
     var cellValue = myList[i][columns[colIndex]]; 

     if (cellValue == null) { cellValue = ""; } 

     row$.append($('<td/>').html(cellValue)); 
    } 
    $(selector).append(row$); 
} 
} 

// Adds a header row to the table and returns the set of columns. 
// Need to do union of keys from all records as some records may not contain 
// all records 

function addAllColumnHeaders(myList, selector) 

{ 
    var columnSet = []; 
var headerTr$ = $('<tr/>'); 

for (var i = 0 ; i < myList.length ; i++) { 
    var rowHash = myList[i]; 
    for (var key in rowHash) { 
     if ($.inArray(key, columnSet) == -1){ 
      columnSet.push(key); 
      headerTr$.append($('<th/>').html(key)); 
     } 
    } 
} 
$(selector).append(headerTr$); 

return columnSet; 
}​ 

HTML:

<body onLoad="buildHtmlTable('#excelDataTable')"> 
<table id="excelDataTable" border="1"> 
    </table> 
</body>​ 

der Tabelle aufzurufen, versuchen

table.on('xhr', function() { 
    var ajaxJson = table.ajax.json(); 
    alert(ajaxJson.data.length + ' row(s) were loaded'); 
}); 

ändern Sie es nach Ihrem Code.

+0

Das ist in Ordnung, aber wie man den "Samp" -Wert außerhalb der Ajax-Funktion bekommt. ich habe einfach 'console.log (samp [0] .memberName);' Eine Seite von Ajax bedeutet, dass sie nicht definiert ist. – Manihtraa

+0

@Manihtraa Ich habe meine Antwort bearbeitet. Versuch es noch einmal – Farid