Ronit
Ronit

Reputation: 127

Why does jQuery doesn't get applied to the results of Laravel pagination from page 2 onwards

I have created a js file to go with my posts's like and dislike function. Also, I have used Laravel's paginate method to make 10 posts in a single page.

But, I don't know why the javascript doesn't seem to work for the posts from page 2 onwards.

UPDATE

This is my js file:

$('.option1').on('click', function (event) {
        var flagL=0;
        var flagD=0;
        event.preventDefault();

        var postIdl = $(this).data("idl");
        postIdl= postIdl.substr(1);
        var postId2 = 'dc'+postIdl;
        var postId1 = 'lc'+postIdl;

        if($('.'+postId2).hasClass('active')){
            flagD=1;}
        if($('.'+postId1).hasClass('active')){
            flagL=1;}
        $.ajax({
            method: 'POST',
            url: urlLike,
            data: {postIdl: postIdl, _token: token, flagL: flagL, flagD: flagD}
        });

        $('.'+postId2).removeClass('active');

    });

    $('.optionx').on('click', function (event) {
        var flagL=0;
        var flagD=0;
        event.preventDefault();

        var postIdd = $(this).data("idd");
        postIdd= postIdd.substr(1);
        var postId1='lc'+postIdd;
        var postId2='dc'+postIdd;

        if($('.'+postId2).hasClass('active')){
            flagD=1;}
        if($('.'+postId1).hasClass('active')){
            flagL=1;}

        $.ajax({
            method: 'POST',
            url: urlDislike,
            data: {postIdd: postIdd, _token: token, flagL: flagL, flagD: flagD}
        });

        $('.'+postId1).removeClass('active');

    });

This is my controller where pagination is used:

public function home()
    {
        $posts=Depress::orderBy('id','DESC')->paginate(10);
        return view('home')->with('posts',$posts);
    }

UPDATE 2

I found what the real problem is, but don't know how to solve it. I have described it in the following link, please take a look:Laravel 5 Paginate + Infinite Scroll jQuery

Any help will be appreciated.

Upvotes: 1

Views: 103

Answers (1)

Mauro Baptista
Mauro Baptista

Reputation: 305

I am using jQuery DataTable to make tables and pagination, and, although it is not the same, I had a really similar problem. I was trying to use popover and it was only working on first page.

I did something like that:

        var today = $('#all').dataTable({
        order: [[ 7, "desc" ]],
        autoWidth: false,
        dom: '<"datatable-header"fl><"datatable-scroll"t><"datatable-footer"ip>',
        language: {
            search: '<span>Filter:</span> _INPUT_',
            lengthMenu: '<span>Show:</span> _MENU_',
            paginate: { 'first': 'First', 'last': 'Last', 'next': '→', 'previous': '←' }
        },
        "aLengthMenu": [[10, 50, 100, -1], [10, 50, 100, "All"]],
        "iDisplayLength": 100
    });

And them:

    today.$('[data-popup="popover"]').popover().click(function(e) {e.preventDefault();});

Two points about this answer:

1) Maybe it should be a comment, but I have no reputation to comment yet.

2) I know it is not what you are looking for, but it is a start.

You should show us some code, it will make it easier to help you.

Upvotes: 0

Related Questions