如何对附加数据jquery进行排序



我有一个for循环,它从服务器获取按降序排序的数据,但在append()中,数据排序不起作用。例如,第一行显示在第二个位置。

如何按照从服务器端数据中排序的方式添加数据?

$(document).on('click', '#jhchat', function() {
$('.jhchat').find('.messagemoda').html('');
var jus = '{{Auth::user()->id}}';

$.ajax({
url: '{{url("getuchats")}}',
type: 'post',
data: {
_token: CSRF_TOKEN
},
success: function(data) {
if (data.length > 0) {
for (var i = 0; i < data.length; i++) {
if (data[0].s_id == jus) {
var mid = data[i].r_id;
} else {
var mid = data[i].s_id;
}
$.ajax({
url: '{{url("getchatdet")}}',
type: 'post',
data: {
_token: CSRF_TOKEN,
'mid': mid,
'chid': data[i].id
},
success: function(res) {
$('.jhchat').find('.messagemoda').append(`
<div class="row mt-3 conv` + res.chat.id + `" alt="` + res.chat.id + `">
<div class="col-11 row mt-2 ads chads cchat` + res.chat.id + `" alt="` + res.chat.id + `" id="` + res.mid + `">
<div class="col-3" style="padding-left: 5px;">
<img src="` + res.img + `" alt="home" width="60" height="60" class="rounded-circle">
</div>
<div class="col-8">
<h6 class="mt-4 text-end">` + res.name + ' ' + (res.mescount > 0 ? '<span class="me-4" style="color: crimson;background-color: bisque;border-radius: 50%;padding-left: 5px;padding-right: 5px;">' + res.mescount + '</span>' : '') + `</h6>
</div>           
</div>
<div class="col-1 mt-4 ps-0 ms-0 float-start text-start" style="position: relative;">
<img src="{{url('images/menu.png')}}" alt="` + res.chat.id + `" width="32px" height="32px" class="hmenu" style="cursor: pointer;background-color: #eee;border-radius: 50%;padding:8px;">
<div class="smenu` + res.chat.id + ` jsmen">` + (res.justo > 0 ? '<a class="me-2 jsmenitem d-block" href="' + res.s + '">go store <img style="margin-right: 2rem;" src="{{url('images / arrow1.png ')}}" width="13px" height="13px"></a>' : '') + `
<p class="text-danger delconv mt-2 mb-0 me-2 jsmenitem" alt="` + res.chat.id + `" style="cursor: pointer;">delete <img style="margin-right: 3.4rem;" src="{{url('images/close1.png')}}" width="10px" height="10px"></p>
</div>
</div>
</div>`);
}
});
}
$(".messagemoda").trigger("update");
} else {
$('.jhchat').find('.messagemoda').html('<div class="mt-5 text-center">no data</div>');
}
}
});
$('.adsopa').css('opacity', '0.3');
$('.sidebarmenu').removeClass('active');
$('.jhchat').css("display", "block");
$('body').css('overflow-y', 'hidden');
});

正如评论中所指出的,如果您有后端,那么您应该在一个请求中获得所有数据,后端可以提供这些数据。这些多个请求无法按照您发送的顺序接收——如果您自己,则无法控制网络的魔力。

最新更新