Witam serdecznie!
Napisałem funkcje, która wyrzuca mi dane w formacie JSON i są one posortowane. Jak mogę wrzucić je w diva tak, aby przedstawić nowy posortowany board.? Proszę o wyrozumiałość bo dopiero uczę się.
Pozdrawiam!
0
0
Dzięki wielkie za pomoc. Powalczę z tym na miarę swoich możliwości i w razie problemów będę pytał. :)
3
Eval do JSONa? Jeśli przychodzący z serwera string jest we właściwym formacie, to nic nie trzeba robić, silnik przeglądarki robi to automagicznie.
Najprościej będzie zrobić to na jQuery, w dużym uproszczeniu coś mniej-więcej takiego (zakładam, że przychodzi tablica z danymi):
var container = $("#container"); // kontener na html z danymi
$.ajax({
url: 'url-do-miejsca-zwracającego-json',
method: "POST",
success: function (data) {
container.empty();
for (var i = 0; i < data.length; ++i) {
var rowContainer = container.append($("<div class='row'>");
for each (var key in data[i])
{
rowContainer.append($("<div class='item'>").text(data[i][key]));
}
}
}
});
Pisane z palca, nie musi zadziałać, ale musisz iść mniej-więcej w tym kierunku, oczywiście musisz obsłużyć błędy komunikacji, rozbić to na osobne, małe funkcje, być może ubrać w klasę/klasy itp.
0
Dziękuje bardzo! W końcu ktoś konkretniej coś napisał :)
Jak ogarnę to dam znać :)
Pozdrawiam!
0
Doszedłem do takiego momentu:
$("#button-sort-cases").click(function updateCases(sort, order) {
var params = {};
params["sort"] = "createDate";
params["order"] = "desc";
var url = "{{restUrl}}cases/caselistsorted";
$.ajax({
type: 'GET',
url: url,
data: params,
dataType: 'json',
success: function (data) {
console.log(data);
if (data != null) {
}
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
console.log("Error: " + textStatus + " " + url);
}
})
});
Wszystko tak jak chciałem czyli po kliknięciu ładowane są dane JSON i wyświetlają mi się teraz w konsoli. Pytanie brzmi jak teraz podmienić je z istniejącymi danymi na stronie? Rozpoczynam funkcje od jeśli data nie równa zero ale nie wiem jakie dalej to logicznie napisać.
1
btw
var params = { sort: "createDate", order: "desc" };
$("#button-sort-cases").click(function (sort, order) {
0
Udało mi się podmieć divy w ten sposób :)) Dziękuje za pomoc!
$(document).on('click', '#button-sort-cases', function(event) {
var params = {};
params["sort"] = "createDate";
params["order"] = "desc";
var url = "{{restUrl}}cases/caselistsorted";
$.ajax({
type: 'GET',
url: url,
data: params,
dataType: 'json',
success: function (data) {
//console.log(data);
if (data != null) {
$(".manage-board-container").html(data["code"]);
console.log(data);
}
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
console.log("Error: " + textStatus + " " + url);
}
})
});
A gdybym chciał dodać opcje żeby wrzucało mi po ponownym kliknięciu z innego jsona dane to jak to ugryźć?
Pozdrawiam!
0
No panie, a co zrobisz, jeśli będziesz chciał żeby - w dowolnym języku programowania - jakiś przycisk robił co innego po pierwszym kliknięciu, a co innego po kolejnych?
1
Zliczaj sobie kliknięcia przycisku do zmiennej i później sprawdzaj w warunku - jak są parzyste to wysyłasz request ajaxowy do jednego miejsca, a w przeciwnym wypadku do drugiego. Oczywiście można to też rozwiązać zwykłym true/false, ale zagadnienie tak banalne, że nie ma większego sensu się produkować i pewnie się połapiesz jak to zrobić.
0
Dziękuje wam serdecznie za pomoc, że poświeciliście chwile czasu by komuś rozjaśnić umysł - doceniam. Zrobiłem wszystko jak chciałem dodałem parę eventów w cssie dla relaksu bo dla mnie był to ciężki cel do osiągnięcia ale dałem radę muszę zrobić tylko jeszcze fixa drobnego bo przy sortowaniu a-z za literą Z czyli ostatnią pojawiają się tytuły, które zostały napisane małą literą ale to drobnostka :)
Pozdrawiam!