Search code examples
ajaxcoldfusionpaginationcfwheels

CFWheels Pagination using AJAX


I've searched the entire Internet, all of it, and cannot find an answer to this.

I'm using the ColdFusion CFWheels Framework to query a database. The query is done via AJAX like this:

var id = $("#ship-id").val();

$.ajax({
    type: "POST",
    url: "/my-controller/my-method?format=json",
    data: {shipId: id},
    dataType: "json",
    success: function(response) {

        var resultHtml = '';

        $.each(response, function(i, value) {
            resultHtml += '<tr><td>' + value.FIRSTNAME + ' ' + value.LASTNAME + '</td></tr>';
        });

        $("#my-table").html(resultHtml);
    }
});

I need to paginate that result set. In CFWheels you normally do that by setting the handle, page, perPage and order values in the query like this:

var order = model("order").findAll(
    select="id, firstname, lastname, email",
    where="orderid IN (#ValueList(orders.id)#)",
    handle="ordersQuery",
    page=params.page, 
    perPage=5, 
    order="lastname"
);

Then you just put this line in your view:

<cfoutput>#paginationLinks(handle="ordersQuery")#</cfoutput>

But... how in the heck can you get pagination to work with an AJAX call?


Solution

  • I think that something along these lines might be your answer (notice I removed the url and added those params to data ...

      $.ajax({
        type: "POST",
        data: {
            shipId: id,
            controller: myController,
            action: myAction,
            page: params.page,
        },
        dataType: "json",
        success: function(response) {
    
            var resultHtml = '';
    
            $.each(response, function(i, value) {
                resultHtml += '<tr><td>' + value.FIRSTNAME + ' ' + value.LASTNAME + '</td></tr>';
            });
    
            $("#my-table").html(resultHtml);
        }
      });