រៀនប្រើប្រាស់ Jquery Ajax ជាមួយនឹង PHP សំរាប់ទាញយកទិន្នន័យ[Pagination]

 
នៅក្នុងអត្ថបទនេះ យើងសូមលើកយកអំពីការប្រើប្រាស់ jquery ajax ដោយអនុវត្តជាមួយនឹង Pagination។ ខាងក្រោមនេះជាតារាងដែលបង្ហាញពីទិន្នន័យមួយដែលមាន ID, NAME, AGE។ នេះជា interface សំរាប់បង្ហាញទិន្នន័យ ដែលយើងបានប្រើប្រាស់ bootstrap សំរាប់ការបង្កើតវា (ព្រោះវាផ្តល់ភាពងាយស្រួល)។

 <nav>  
  <ul class="pagination">  
   <li>  
    <a href="#" aria-label="Previous">  
     <span aria-hidden="true">&laquo;</span>  
    </a>  
   </li>  
   <li><a href="#">1</a></li>  
   <li><a href="#">2</a></li>  
   <li><a href="#">3</a></li>  
   <li><a href="#">4</a></li>  
   <li><a href="#">5</a></li>  
   <li>  
    <a href="#" aria-label="Next">  
     <span aria-hidden="true">&raquo;</span>  
    </a>  
   </li>  
  </ul>  
 </nav>  

បន្ទាប់មកយើងត្រូវសរសេរ sql query សំរាប់ទាញយកទិន្នន័យ។ ដោយសារយើងប្រើប្រាស់ Posgresql ដូចនេះយើងអាចសរសេរ sql query សំរាប់ទាញយកទិន្នន័យបានដូចតទៅនេះ៖ SELECT ID, NAME, AGE FROM TBL_INFO LIMIT ចំនួនជួរដេក OFFSET ចាប់ផ្តើមពីជួរដេកទី ។ ដោយសារយើងបើកវេបផេកដំបូងយើងចង់បង្ហាញទិន្នន័យចាប់ពីទី១ ហើយបង្ហាញម្តង១០ នោះយើងបាន sql query ដូចនេះ SELECT ID, NAME, AGE FROM TBL_INFO LIMIT 10 OFFSET 0 ។ តែដោយសារ គេអាចរំកិលទៅទំព័របន្ទាប់ទៀតបាន យើងមិនដាក់តម្លៃរបស់ ចំនួនជួរដេកស្មើរ 10 និង ចាប់ផ្តើមពីជួរដេកទី នៅក្នុង sql query ទេ។ យើងនឹងបោះវាជា parameter វិញ។ ដូចនេះយើងបាន sql query ចុងក្រោយ SELECT ID, NAME, AGE FROM TBL_INFO LIMIT ? OFFSET ?
បង្កើតជា file php មួយសំរាប់ handleកាងារជាមួយ pagination (pagination.php) រួចសរសេរដូចខាងក្រោម៖ ស្វែងយលអំពីការប្រើប្រាស់ PDO សូមចុច ទីនេះ

 $db = new PDO($dns, $username, $password);  
 $rowCount = $_POST[“ROW_COUNT”];  
 $start = $_POST[“PG_NUM”];  
 if(!isset($rowCount)){  
  $rowCount= 10;  
 }  
 if(!isset($start)){  
 $start= 0;  
 }  
 $start = $rowCount * $start;  
 $sql = “SELECT ID, NAME, AGE FROM TBL_INFO LIMIT ? OFFSET ?”;  
 $query= $db->prepare($sql);  
 $result = $query->execute(array($rowCount, $start));  
 echo json_encode($result);  

បន្ទាប់មកសរសេរកូដ javascript ដោយប្រើប្រាស់ jquery ajax ដូចខាងក្រោម

 $(“.pagination a”).click(function(){  
 var rowCount = 10; // default row per page  
 var pageNum = $(this).text();  
 var input = {“ROW_COUNT” : rowCount, “PG_NUM” : pageNum};  
 $.ajax({  
      type: “POST”,  
      url: “pagination.php”,  
      data : input,  
      error : function(jqXHR, textStatus, eX){ console.log(textStatus, eX);},  
      success: function(dat) { // generate table}  
 });  
 });