Load nội dung của category bằng ajax

Chào các bạn!
Mình có đoạn code lấy toàn bộ các bài viết của 1 category khi click vào url của nó, cái mình làm nó đã hoạt động nhưng có vẻ không đc tối ưu cho lắm về tốc độ, các bạn có thể xem qua code của mình rồi cho mình ý kiến với nhé:

trang đầu tiên có cấu trúc như này:

<div class="filter">
    <a href="http://mydomain.dev/category/trending">Trending</a>
    <a href="http://mydomain.dev/category/sale">Sale</a>
</div>

<div class="content">Nội dung khi lấy xong sẽ đc gán vào đây</div>

ở page category thì đại loại có cấu trúc như vầy

...
<div clas="view">
đây là div chứa danh sách các bài viết dạng danh sách
</div>
...

đây là đoạn js nhỏ của mình, khi click vào url trên kia thì nó sẽ tìm cái div.view ở trang category sau đó gán vào div.content của trang đầu tiên

$('.filter').on('click', 'a', function(e){
    e.preventDefault();

    var url= $(this).attr('href');

    $.get(url, function (response) {

        var $data = $(response),

            $view = $data.find('.view');
            $('.content').html($view);

    }, 'html');
});

Vấn đề của mình là khi click vào cái thẻ a có url đến trang category kia thì nó sẽ load toàn bộ cái trang đó và sau đó tìm cái cần tìm là div.view rồi gán vào div.content, bạn nào có cách nào hay hơn và tối ưu hơn thì chia sẻ mình với, mình ko rành nhiều về ajax với jquery lắm

Cám ơn vì đã đọc bài :slight_smile:

Code 1 route api, trả về json, phía client request rồi tự render

Ngoài ra đơn giản hơn thì trong code ajax post/get, thêm 1 đoạn input is_ajax, phía server check request, nếu có biến đó thì chỉ trả về đoạn html kia thôi, còn lại bỏ qua

2 Likes

cám ơn bạn đã reply, để mình tìm hiểu thêm

83% thành viên diễn đàn không hỏi bài tập, còn bạn thì sao?