Programuje hobbystycznie dlatego proszę o wyrozumiałość.
Jestem w trakcie pisania aplikacji IoT, która ma umożliwiać pobieranie informacji z micokontrollerów, ale również sterować nimi.
Kupiłem taki template jak poniżej w linku.
http://symbiot4.creatingo.com/
Zleży mi na asynchronicznym wysyłaniem żądań REST. Dlatego chce wykorzystać JQuery AJAX.
Nie mam pojęcia, jakie jest podejście podczas generowania strony.
Chciałbym, aby podczas otwierania strony pobrać informacje z bazy danych i wygenerować odpowiednie div'y
Niżej kawałek html z powyżej strony.
<div class="card active" data-unit="switch-light-4">
<!-- Light switch START -->
<div class="card-body d-flex flex-row justify-content-start">
<svg class="icon-sprite">
<use class="glow" fill="url(#radial-glow)" xlink:href="assets/images/icons-sprite.svg#glow"/>
<use xlink:href="assets/images/icons-sprite.svg#bulb-eco"/>
</svg>
<h5>Bedroom</h5>
<label class="switch ml-auto">
<input type="checkbox" id="switch-light-4">
</label>
</div>
<!-- Light switch END -->
<hr class="my-0">
<!-- Bulb details START -->
<ul class="list-group borderless px-1">
<li class="list-group-item">
<p class="specs">Connection</p>
<p class="ml-auto mb-0 text-success">OK</p>
</li>
<li class="list-group-item pt-0">
<p class="specs">Power Consumption</p>
<p class="ml-auto mb-0">15W</p>
</li>
<li class="list-group-item pt-0 pb-4">
<p class="specs">Voltage range</p>
<p class="ml-auto mb-0">110-130V</p>
</li>
</ul>
<!-- Bulb details END -->
<hr class="my-0">
<!-- Dimmer control - range slider START -->
<ul class="list-group borderless px-1" data-rangeslider="dimmer-light-4">
<li class="list-group-item">
<p class="specs">Dim</p>
<p class="ml-auto mb-0"><span class="range-output">65</span>%</p>
</li>
<li class="list-group-item pt-0 pb-4">
<input id="dimmer-light-4" type="range" min="10" max="100" value="65">
</li>
</ul>
<!-- Dimmer control - range slider END -->
</div>
Czy dobrym podejściem jest połączenie JSP z AJAX?
Tzn. Strona ładowana jest przy użyciu JSP gdzie zwracam wszystkie informacje o przełącznikach i czujnikach, a wysyłanie żądań REST używając AJAX(np. zmiana stanu z off na on) ?
Chętnie obejrzałbym jakieś przykłady, w jaki sposób obecnie jest to rozwiązywane.
Czy może jednak załadować pustą stronę używając poniżej funkcji (czyli zwrócenie html), a następnie używając AJAX pobrać dane z endpoint'ów i wygenerować div'y.
@RequestMapping(value = {"/", "/index"}, method = RequestMethod.GET)
public String welcome(Model model) {
return "index";
}