title: Server-Side Paging with MySQL, PHP, and AngularJS
body: <p>This is my first post on this site, and while I have gone through the 2 min. tour please guide me in the right direction if this question seems misplaced or not in line with the site's rules.</p>
  
  <p>I have created/modified a PHP script (below), that puts a MySQL table in a JSON format. I'm working with 700,000+ rows so I thought my best bet was to use pagination. </p>
  
  <pre><code>&lt;?php 
  require('connection.php');
  header('Content-Type: application/json');
  
  ini_set("max_execution_time", "-1");
  ini_set("memory_limit", "-1");
  ignore_user_abort(true);
  set_time_limit(0);
  
  // PortalActivity Table - JSON Creation
  
  $limit = $_POST['limit']; //the pagesize
  $start = $_POST['start']; //Offset
  $dir = $_POST['dir']; // DESC or ASC
  $sort = $_POST['sort'];// the column
  
  switch ($sort) {
      case "CallerPhoneNum": $orderby = "CallerPhoneNum"; break;
      case "Carrier": $orderby = "Carrier"; break;
      case "TotalLookups": $orderby = "TotalLookups"; break;
      case "TotalBlocks": $orderby = "TotalBlocks"; break;
      case "TotalComplaints": $orderby = "TotalComplaints"; break;
      case "ActivityRanking": $orderby = "ActivityRanking"; break;
      case "CallerType": $orderby = "CallerType"; break;
  }
  
  $sql = "SELECT COUNT(*) AS count FROM portal.PortalActivity";
  $result = $conn-&gt;query($sql);
  $row = $result-&gt;fetch(PDO::FETCH_ASSOC);
  $count = $row['count'];
  
  $query = "SELECT * FROM portal.PortalActivity ORDER BY $orderby $dir LIMIT $start, $limit";
  
  $result = $conn-&gt;query($query);
  
  while ($row = $result-&gt;fetch(PDO::FETCH_ASSOC)) {
      $PortalActivity[] = array(
          'CallerPhoneNum' =&gt; $row['CallerPhoneNum'],
          'Carrier' =&gt; $row['Carrier'],
          'TotalLookups' =&gt; $row['TotalLookups'],
          'TotalBlocks' =&gt; $row['TotalBlocks'],
          'TotalComplaints' =&gt; $row['TotalComplaints'],
          'ActivityRanking' =&gt; $row['ActivityRanking'],
          'CallerType' =&gt; $row['CallerType']
          );
  }
  
  $myData = array('PortalActivity' =&gt; $PortalActivity, 'totalCount' =&gt; $count);
  
  echo json_encode($myData);
  
  
  ?&gt;
  </code></pre>
  
  <p>The code gives me the data in all the rows as well as a Total Count of the rows.</p>
  
  <p>I have a bootstrap framework that uses AngularJS. I would like to put the data in a table using pagination. So, when ever a user clicks "next" or clicks to a new page, the server would only load the necessary records per page (10, 25, 50, or 100).</p>
  
  <p>I know that I am needing to: 1.) Create the paging in my controller 2.) Get the data from my controller to my php file so it can correctly receive the right limits and offsets. 3.) Display this in my view</p>
  
  <p>I am new to these languages and I have found myself in a time crunch to get this demo out. How can I get these files working together (PHP, JS, and HTML) to correctly display the paging I need?</p>
  
  <p>This is my original controller that is just displaying the data in a filtered view. As shown below, I'm using $http.get to get the data. This controller works, but I'm needing to take it a step further with the paging:</p>
  
  <pre><code> app.controller('counterCtrl', function($scope, $http, $filter, filterFilter) { 
  
       $scope.Unknown = 'UK';
       $scope.NonProfit = 'NP';
       $scope.Political = 'PL';
       $scope.Prison = 'PR';
  
      $scope.getCount = function(strCat) {
          return filterFilter( $scope.items, {CallerType:strCat}).length;
      }
  
      $http.get("http://xx.xxx.xx.xx/php/jsoncreatePA.php")
          .success(function (data) {
              $scope.items = data.PortalActivity;
              });
   })
  </code></pre>
  
  <p>This is part of the view I've created with the working controller: </p>
  
  <pre><code>&lt;section id="main-content" class="animated fadeInRight"&gt;
    &lt;div class="row"&gt;
          &lt;div class="col-md-12"&gt;
                  &lt;div class="panel panel-default"&gt;
                    &lt;div class="panel-heading"&gt;
                      &lt;h3 class="panel-title"&gt;Unknown&lt;/h3&gt;
  
                    &lt;/div&gt;
                  &lt;div class="panel-body"&gt;
                  &lt;table id="example" class="table table-striped table-bordered" datatable="" cellspacing="0" width="100%"&gt;
                      &lt;thead&gt;
                          &lt;tr&gt;
                              &lt;th&gt;Caller Number&lt;/th&gt;
                              &lt;th&gt;Total Lookups&lt;/th&gt;
                              &lt;th&gt;Total Blocks&lt;/th&gt;
                              &lt;th&gt;Total Complaints&lt;/th&gt;
                              &lt;th&gt;Activity Percentage&lt;/th&gt;
                          &lt;/tr&gt;
                      &lt;/thead&gt;
  
                      &lt;tbody&gt;
                          &lt;tr data-ng-repeat = "x in items | filter: { CallerType : Unknown }"&gt;
                              &lt;td&gt;{{x.CallerPhoneNum}}&lt;/td&gt;
                              &lt;td&gt;{{x.TotalLookups}}&lt;/td&gt;
                              &lt;td&gt;{{x.TotalBlocks}}&lt;/td&gt;
                              &lt;td&gt;{{x.TotalComplaints}}&lt;/td&gt;
                              &lt;td&gt;{{x.ActivityRanking}}&lt;/td&gt;
                          &lt;/tr&gt;
                      &lt;/tbody&gt;
                  &lt;/table&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/section&gt;
  </code></pre>