I'm currently developing a stock trading application that relies on Yahoo Finance to retrieve stock prices.
My goal is to have the prices automatically update every 5 seconds without needing to refresh the page. I understand that this can be achieved using AJAX technology.
This is what my Java controller looks like:
@GetMapping("/banking/stocks")
public String stocks(Model model) {
model.addAttribute("stock", new StockDto());
try {
List<Stock> stocks = stockService.getDefaultStocks(getCurrentUser());
model.addAttribute("stocks", stocks);
} catch (IOException e) {
e.printStackTrace();
}
return "stocks.html";
}
Here's how the HTML is structured:
<tbody>
<tr th:each="stock : ${stocks}">
<td th:text="'$'+${stock.getSymbol()}"></td>
<td th:text="${stock.getName()}"></td>
<td th:text="${stock.getQuote().getPrice()}"></td>
<td
th:class="${stock.getQuote().getChangeInPercent() > 0 ? 'text-success' : 'text-danger'}"
th:text="${stock.getQuote().getChangeInPercent() + '%'}"></td>
<td th:if="${stock.getDividend().getAnnualYield() != null}"
th:text="${stock.getDividend().getAnnualYield() + '%'}">0.00%</td>
<td th:if="${stock.getDividend().getAnnualYield() == null}">0.00%</td>
</tr>
I am struggling with implementing AJAX to ensure getPrice() is called and updated every 5 seconds on the page. Would greatly appreciate any help or guidance on this issue.
Thank you!