Jquery callback function executes over and over again...

Question

This my jquery function,

function getRecordspage(curPage, pagSize) {
   // code here
$(".pager").pagination(strarr[1], { callback: 
         function() { getRecordspage(2, 5);},current_page: curPage - 1, 
          items_per_page:'5',  num_display_entries: '5', next_text: 'Next', 
           prev_text: 'Prev', num_edge_entries: '1'
      });

}

and i call this jquery function,

<script type="text/javascript">
         $(document).ready(function() {
             getRecordspage(1, 5);
         });

</script>

As you see my It works fine for 1st time and my callback function is configured to the current function itself... when it gets called the callback gets executed over and over again.... How can i prevent this? Any suggestion....

EDIT:

This is my function

function getRecordspage(curPage, pagSize) {
    $.ajax({
        type: "POST",
        url: "Default.aspx/GetRecords",
        data: "{'currentPage':" + curPage + ",'pagesize':" + pagSize + "}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(jsonObj) {
            var strarr = jsonObj.d.split('##');
            var jsob = jQuery.parseJSON(strarr[0]);
            var divs = '';
            $.each(jsob.Table, function(i, employee) {
                divs += '<div class="resultsdiv"><br /><span class="resultName">' + employee.Emp_Name + '</span><span class="resultfields" style="padding-left:100px;">Category&nbsp;:</span>&nbsp;<span class="resultfieldvalues">' + employee.Desig_Name + '</span><br /><br /><span id="SalaryBasis" class="resultfields">Salary Basis&nbsp;:</span>&nbsp;<span class="resultfieldvalues">' + employee.SalaryBasis + '</span><span class="resultfields" style="padding-left:25px;">Salary&nbsp;:</span>&nbsp;<span class="resultfieldvalues">' + employee.FixedSalary + '</span><span style="font-size:110%;font-weight:bolder;padding-left:25px;">Address&nbsp;:</span>&nbsp;<span class="resultfieldvalues">' + employee.Address + '</span></div>';
            });
            $("#ResultsDiv").append(divs);
         }
    });
}

Answer 1

The callback function in this case is to display the appropriate content, not do the pagination, your setup should look more like this:

var itemsPerPage = 5;
$(document).ready(function() {
  $(".pager").pagination(maxNumberOfElementsHere, { 
     callback: getRecordspage,
     items_per_page: itemsPerPage,
     num_display_entries: 5,
     next_text: 'Next', 
     prev_text: 'Prev',
     num_edge_entries: 1
  });
});

function getRecordspage(curPage) {
 // itemsPerPage is the new pagSize you have now
 // code here
}

Answer 2

The fact that you are calling the function in the function is causing the problem. It's causing an infinite loop, and will never end.

You need to give it an IF statement so it will end at some point.