APEX AJAX and how to use apex.server.process

Pada kasus pemkaian dynamic biasanya kita telah terbiasa memakai fitur dari APEX yaitu Dynamic Action (DA). DA merupakan salah satu fitur terbaik yang dimiliki oleh APEX untuk melakukan proses AJAX dan hal lain dengan secara declarative dan bisa di gabunkan dengan kondisi dan sekuriti. Namun pada kasus-kasus khusus  nanti kita tetap perlu untuk membangun AJAX secara manual tanpa atau dikombinasikan dengan DA.

APEX telah menyediakan API untuk hal ini, namun sayang sangat ringkas sehingga perlu try-error untuk memahaminya. Tulisan Tom Petrus sangat mencerahkan dan detail untuk memahami hal ini. saya sangat merekomendasikan untuk membacanya untuk memahami gambaran besar APEX AJAX. 

Adapun hal yang harus diperhatikan adalah APEX AJAX adalah :

• Gunakan documented API dalam hal ini (apex.server.process) untuk pembuatan proses AJAX supaya dalam perkembangannya jika aplikasi di migrasi ke versi yang terbaru tidak muncul masalah.
• Dalam apex.server.process return default adalah JSON, jadi hati-hati karena meskipun kita telah membangun data dengan konstruksi JSON jika dilakukan lewat PL/SQL maka akan selalu menjadi string atau text, jadi untuk proses ini salalu gunakan opsi = dataType: "text". Setelah itu dalam proses JS kita bisa parsing kedalam JSON object memakai jQuery.parseJSON(pData)
• Opsi = success agak membingunkan sering diartikan bahwa disitu untuk hadle proses sukses saja, namun sebenarnya adalah untuk funsi callback yang dilakukan setelah memperoleh return data dari proses pl/sql.
• Cara melakukan passing parameter, item, value dan array.

Silahkan akses contoh pemakaiannya di demo ini disitu akan diperlihatkan contoh code javascript dan pl/sql yang digunakan. Selamat mencoba.

Miscellaneous Javascript APIs

• $x(pNd)
Adalah sebuah padanan dari getElementById(). Dengan pNd adalah id dari DOM atau string "id". returnnya adalah DOM element atau false jika tidak ada.
contoh : $x(P43_TEXT) atau $x("P43_TEXT").
Pemakaian untuk get: $x("P43_TEXT").value, $x("P43_TEXT").name
Pemakaian untuk set: $x("P43_TEXT").value="Test", $x("P43_TEXT").name="test"
Namun tidak semua jenis item dapat dilakukan operasi tersebut seperti checkbox, selectlist dan shuttle.
• $v(pNd), $v2(pNd), apex.item(pNd).getValue(),$f_SelectValue(pNd) dan $("#pNd").val()
Semuanya pada dasarnya adalah untuk mendapatkan value dari sebuah item, namun memiliki beberapa perbedaan. Pada test kasus item berikut :
• Hidden, text, text area, date picker, popup lov (basis input) semua berhasil memperoleh value, khusus untuk display only $("#pNd").val() memakai $("#pNd").text()
• selectlist, checkbox, radiogroup, list manager hanya $v(pNd) $v2(pNd) apex.item(pNd).getValue() dan $f_SelectValue(pNd) yang bisa memperoleh value
• $v2(pNd) adalah shortcut untuk apex.item(pNd).getValue()
• untuk kasus item multiple value perbedaan dari $v(pNd) dan $v2(pNd) adalah $v(pNd) mendapatkan nilai persis string dari item sedangkan $v2(pNd) dalam bentuk array
Kesimpulan yang dapat diambil adalah selalu gunakan APEX APIs $v(pNd) atau $v2(pNd) untuk mengambil nilai item.
• $s(pNd, pValue, pDisplayValue, pSuppressChangeEvent), apex.item( pNd ).setValue(pValue, pDisplayValue, pSuppressChangeEvent), $x_Value(pNd,pValue) dan $("#pNd").val("pValue")
Sama halnya dengan kasus get selalu gunakan APEX APIs, $s(pNd, pValue, pDisplayValue, pSuppressChangeEvent) adalah shortcut untuk apex.item( pNd ).setValue(pValue, pDisplayValue, pSuppressChangeEvent). Kelebihan dari $s( pNd,pValue, pDisplayValue, pSuppressChangeEvent) adlah kita bisa melakukan pada semua jenis item dengan bisa mengatur pSuppressChangeEvent property ini berguna dalam urusan Dynamic Actions
• Silahkan coba fungsi2 diatas pada page demo berikut