Wie man eine Liste, die von AJAX zurückgegeben wird, und eine Listenreferenz auf der Seite unter Verwendung von EL setzt

Question

Ich habe eine JSP-Seite, die zum ersten Mal mit einer Liste von Elementen aufgerufen wird. Bei der Auswahl eines Dropdown-Menüs (Auswahl) trigger ich den AJAX-Code, um Produkte zu erhalten, die für die ausgewählte Option spezifisch sind, und ich möchte die Produktliste mit relevanteren Produkten überschreiben.

Gibt es eine Möglichkeit, es auf "$ {products}" zu setzen oder muss ich einen anderen Ansatz verwenden, wie das div-Tag zu verbergen und ein anderes anzuzeigen.

Meine JSP-Seite

<div> 
    <c:forEach var="p" items="${products}"> 
    <table> 
     <td>p.name</td> 
     <td>p.description</td> 
    </table> 
    </c:forEach> 
<div> 

Mein Skript

// Ajax... 
success: function(result) { 
    if (result.length > 0) { 
    // want to set the products list with the list returned 
    } 
} 

mein Controller

public List<Product> MyController() { 
    // ... 
    List<Product> products = prodcat.getList() 
    return products 
} 

Answer 1

Vielen Dank für Ihre Antwort möchte ich Ihnen mein Ansatz sagen. Ich benutzte AJAX Jackson und versuchte, die Liste der Produkte an die Ansicht zu übergeben. Ich habe eine bidirektionale Zuordnung zwischen Meine Produkte (One) und Bewertung (Viele) implizit auf Objektkonvertierung ging es in eine Endlosschleife, weil es im Produkt Bewertung fand und Produkt in Bewertung. Ich habe eine andere Model-Klasse erstellt und nur die Attribute festgelegt, die ich von der Produktklasse benötigte, anstatt die Produktliste zu senden. Also habe ich am Ende nur das div-Tag mit den neuen Elementen überschrieben, die ich erhalten habe.

Answer 2

Es gibt zwei Möglichkeiten, um Ihr Problem zu beheben, aber zuerst sollte man sich bewusst sein, dass beide JSP und el sind serverseitige Technologien, was bedeutet, dass sie ausgeführt werden e auf der Serverseite, um eine HTML Antwort zu generieren, die an die Clientseite gesendet wird, um im Browser gerendert zu werden. Wenn die Produkttabelle also zum ersten Mal auf der Clientseite gerendert wird, müssen Sie einige JavaScript verwenden Code, der auf der Client-Seite ausgeführt wird, zu entfernen/ersetzen, den Tabelleninhalt

So ist der erste Weg ist diese Tabelle (zB in einer separaten JSP Datei zu setzen, products_view.jsp und statt products Objekt zurückzugeben, Sie kehren ModelAndView Objekt von Ihrer Controller-Methode:

Controller

@RequestMapping(method=RequestMethod.GET, value="/products_view") 
public ModelAndView MyController() { 
    // ... 
    List<Product> products = prodcat.getList(); 
    model.addAttribute("products", products); 
    return new ModelAndView("products_view"); 
} 

products_view.jsp

<div id="products_table"> 
    <table> 
    <c:forEach var="p" items="${products}"> 
     <tr> 
     <td>p.name</td> 
     <td>p.description</td> 
     </tr> 
    </c:forEach> 
    </table> 
<div> 

AJAX

// Ajax... 
success: function(result) { 
    if (result.length > 0) { 
    $("#products_table").html(response); 
    } 
} 

Die andere Methode ist, dass Sie eine JSON oder XML-Antwort dieser Produktliste von Ihrem Controller zurückgeben, und dann Sie bevölkern diese JSON-Antwort in Ihre Tabelle auf der Client-Seite, stellen Sie sicher, dass Sie Jackson Gläser in Ihrer Abhängigkeiten Liste

haben

-Controller

@RequestMapping(method=RequestMethod.GET, value="/products_view", produces="application/json") 
public @ResponseBody List<Product> MyController() 
    // ... 
    List<Product> products = prodcat.getList(); 
    return products ; 
} 

AJAX

// Ajax... 
dataType: "json", 
success: function(result) { 
    if (result.length > 0) { 
    var productTableHTML = '<table>'; 
    $.each(response, function (key,value) { 
     productTableHTML += 
     '<tr><td>' + key + '</td><td>' + value + '</td></tr>';  
    }); 
    productTableHTML += '</table>'; 
    $("#products_table").html(productTableHTML); 
    } 
}