Serverside Key Selector

Jika properti "serverSideGrid" diatur ke true dalam objek "crudOpt", maka pada permintaan metode GET awal akan disertakan query string yang mencerminkan interaksi pengguna pada tabel untuk melakukan filter data pada backend. Contoh dari query string yang dibentuk adalah sebagai berikut:

page, length, sort, sort_dir, search

Namun, jika kamu menggunakan Saba Framework versi Python atau respon dari backend terkait pagination/serverside berbeda dengan format bawaan, kamu dapat menambahkan alias sesuai kebutuhan kamu seperti contoh dibawah ini:

{
  "pageType": "crud",
  "pageTitle": "USER",
  "crudOpt": {
    "endpointName": "https://reqres.in/api/users",
    "detailFromGrid": true,
    "serverSideGrid": true,
    "serverSideGridQuery": {
      "page": "page",
      "length": "per_page"
    },
    "serverSideGridResp": {
      "page": "page",
      "length": "per_page",
      "total": "total_pages"
    }
  }
}

contoh konfigurasi diatas karena kebutuhan request & respons dari backend seperti ini:

serverSideGridQuery adalah properti untuk menambahkan alias ketika request ke backend.

serverSideGridPath adalah properti untuk menambahkan alias ketika request ke backend, sama seperti serverSideGridQuery namun alias akan ditempatkan pada path url.

serverSideGridResp adalah properti untuk menambahkan alias ketika mendapat response dari backend.

Perhatikan juga contoh berikutnya (serverSideGridPath):

Array yang berisi data yang akan ditampilkan pada UI berada pada key posts, query untuk mengambil halaman berada pada path ".../page/1" dan array pagination berada pada key pagination.

maka penyesuaian yang bisa dilakukan seperti ini :

"crudOpt": {
    "gridTheme": "table",
    "serverSideGrid": true,
    "serverSideGridPath": [
      "page"
    ],
    "serverSideGridResp": {
      "page": "pagination.currentPage",
      "total": "pagination.totalPage"
    },
    "sourceDataFrom": 2,
    "endpointName": "https://jakpost.vercel.app/api/category/indonesia/politics/page",
    "resp_key": "posts",
    "removeDefaultHttpHeader": true,
    "data_idField": ""
}

Last updated