skip to Main Content

I am trying to load data from ajax call from the pagination on the html page but it is somehow not working.. not able to understand the problem

I have checked this link but ajax call is not working in my code i need to fetch the list of Company Registration and populate in the datatable with the implementation of pagination and while controlling the loading time of the page through pagination.(like the records are 5000 and it loads all together i need to fix server side pagination from ajax)

Passing pageable (spring data) in post request

<script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js">

<script type="text/javascript">
         $(document).ready(function(){
           $('#shortstorage').DataTable({
                    "pageLength": 5,
                    "processing": true
                    "serverSide": true
                      "ajax": {
                       "url": "/getcompany",
                     "type": "GET"
              }
                  }
                       } );
        });
   </script>

The call is make to the getcompanyy method in the controller

@RequestMapping(value = "/getcompanyy", method = RequestMethod.GET)
    public String getCompanyy(Model model,HttpServletRequest request, @PageableDefault(value=10, page=0) Pageable pageable) {


        pageable = new PageRequest(pageable.getPageNumber(), pageSize, sort);

 Page<CompanyRegistration> compregPag = companyregister.findAll(pageable);
      List<CompanyRegistration> compreg = compregPag.getContent();
model.addAttribute("compreg",compreg);
return "admin/company";

Error

The code is loading all rows in data table without the pagination applied

2

Answers


  1. You actually should return JSONObject,
    take a look at this RestController, I think this is what you need:

    https://github.com/solutionman/BaseProject/blob/master/src/main/java/com/project/base/controller/BaseProjectRestController.java

    <table id="shortstorage" class="display">
    </table>
    
    $(document).ready( function () {
    var table = $('#shortstorage').DataTable({
        ajax: '/base/getcompany',
        sAjaxDataProp: 'data',
        processing: true,
        serverSide: true,
        // "order": [[ 0, "asc" ]],
        columns: [
            { data: "id", title : 'id'},
            { data: "name", title: 'name' },
            { data: "shortname", title: 'shortname' }
        ]
    })
    

    });

        @RequestMapping(path = "/getcompany", method = RequestMethod.GET)
    public Map< String, Object > getcompany(@RequestParam Map<String, String> data) {
    
        Map<String, Object> result = new HashMap<>();
    
        Integer draw = Integer.parseInt(data.get("draw"));
    
        ArrayList<Object> youObjectsSelected = new ArrayList<>(); // put your selected objects here
        int start = Integer.parseInt(data.get("start"));
        int length = Integer.parseInt(data.get("length"));
        for( int j = 0; j < 50; j++ ){
            Company company = new Company();
            company.setId(j);
            company.setName("someName");
            company.setShortname("shortName");
            youObjectsSelected.add(company);
        }
        ArrayList<Object> yourSObjectsForPage = new ArrayList<>(); // get only objects for displaying on page
        for( int k = start; k < start + length; k++ ){
            yourSObjectsForPage.add( youObjectsSelected.get(k) );
        }
    
        result.put("draw", draw);
        result.put("recordsTotal", 100);
        result.put("recordsFiltered", youObjectsSelected.size());
        result.put("data", yourSObjectsForPage);
    
        return result;
    }
    

    pagenumber and pagerows youll get from start and length (from data) :

    int start = Integer.parseInt(data.get(“start”));

    int length = Integer.parseInt(data.get(“length”));

    and according to them select objects for rows from database, arrayList here just for example.

    Login or Signup to reply.
  2. Page<CompanyRegistration> compregPag = companyregister.findAll(pageable);
    //List<CompanyRegistration> compreg = compregPag.getContent();
    model.addAttribute("compregPag",compregPag); 
    

    compregPag has content that is needed along with metadata. Use that as a model attribute.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search