Relselect

Klik untuk menyalin

Pilih komponen untuk memilih nilai dari Model Data.


Pengaturan awal

Data source data - model data yang akan digunakan untuk menampilkan opsi tarik-turun.

Mode - pilih Multiple untuk dapat memilih beberapa opsi dari dropdown. Jika tidak, mode Single harus digunakan.


Pengaturan Tampilan dan Nuansa

Label (bukan mantory) digunakan untuk menunjukkan label komponen.

Placeholder (tidak wajib) digunakan untuk menunjukkan placeholder komponen.

Name (wajib) - nama komponen.

Size (wajib) - ukuran komponen. Diset ke Default saat komponen dibuat.

Search (wajib) - untuk dapat mencari dalam opsi dropdown yang tersedia. Dinonaktifkan secara default.

Clear icon (wajib) - menampilkan ikon opsi yang jelas jika diaktifkan. Dinonaktifkan secara default.

Disabled (wajib) - membuat komponen dinonaktifkan jika dihidupkan. Dinonaktifkan secara default.

Visible (wajib) - membuat komponen terlihat jika dihidupkan. Diaktifkan secara default.


Data

Data source data - Model Data yang digunakan. Dapat dikonfigurasi hanya pada pembuatan komponen.

Label - Bidang Model Data yang akan ditampilkan dalam satu opsi tarik-turun.


Pemicu alur kerja

  • onChange - aktif ketika opsi dropdown berubah.
  • onFocus - aktif ketika komponen Relselect sedang difokuskan.
  • onBlur - aktif ketika komponen Relselect kabur.
  • onCreate - aktif saat komponen dibuat.
  • onShow - aktif saat komponen ditampilkan.
  • onHide - menyala ketika komponen disembunyikan.
  • onSearch - aktif saat pengguna mencari dalam opsi yang tersedia.
  • onOpen - diaktifkan pada dropdown.
  • onLoadAll - aktif ketika semua opsi dropdown diunduh.

Tindakan Komponen

RelSelect Get Properties

Mendapatkan properti komponen.

Parameter masukan :

  • Component Id [string] - pengenal komponen RelSelect;

Parameter keluaran :

  • Selected [Data Model type/ Data Model Array type] - opsi yang dipilih. Untuk ditampilkan dalam proses bisnis saat ID Komponen hanya ditentukan.
  • Data [Data Model Array type] - array elemen Model Data yang akan digunakan. Tersedia dalam proses bisnis ketika ID Komponen hanya ditentukan.
  • Label [string] - label komponen;
  • Placeholder [string] - placeholder komponen;
  • Allow Clear [boolean] - memungkinkan menghapus pilihan jika benar;
  • Disable [boolean] - menonaktifkan komponen jika benar;
  • Tooltip [string] - string tooltip;
  • Required Mark [boolean] - menunjukkan tanda wajib jika benar;
  • Debounce (ms) [integer] - penundaan untuk memvalidasi nilai;
  • Validate Icon [boolean ] - ikon yang akan ditampilkan pada validasi nilai;
  • Validate Status [Status type] - status yang akan ditampilkan pada validasi nilai;
  • Validate Message [string] - pesan yang akan ditampilkan saat memvalidasi nilai.

RelSelect Get Properties

RelSelect Set Properties

Mengatur properti komponen.

Parameter masukan :

  • Component Id [string] - pengenal komponen RelSelect ;
  • Label [string] - label komponen;
  • Placeholder [string] - placeholder komponen;
  • Allow Clear [boolean] - memungkinkan menghapus pilihan jika benar;
  • Disable [boolean] - menonaktifkan komponen jika benar;
  • Tooltip [string] - string tooltip;
  • Required Mark [boolean] - menunjukkan tanda wajib jika benar;
  • Debounce (ms) [integer] - penundaan untuk memvalidasi nilai;
  • Validate Icon [boolean] - ikon yang akan ditampilkan pada validasi nilai;
  • Validate Status [Status type] - status yang akan ditampilkan pada validasi nilai;
  • Validate Message [string] - pesan yang akan ditampilkan saat memvalidasi nilai.

RelSelect Set Properties

RelSelect Update Properties

Memperbarui properti komponen.

Parameter masukan :

  • Selected [Data Model type/ Data Model Array type] - opsi yang dipilih. Untuk ditampilkan dalam proses bisnis saat Component ID hanya ditentukan.
  • Data [Data Model Array type] - array elemen Model Data yang akan digunakan. Tersedia dalam proses bisnis ketika Component ID hanya ditentukan.
  • Component Id [string] - pengenal komponen RelSelect ;
  • Label [string] - label komponen;
  • Placeholder [string] - placeholder komponen;
  • Allow Clear [boolean] - memungkinkan menghapus pilihan jika benar;
  • Disable [boolean] - menonaktifkan komponen jika benar;
  • Tooltip [string] - string tooltip;
  • Required Mark [boolean] - menunjukkan tanda wajib jika benar;
  • Debounce (ms) [integer] - penundaan untuk memvalidasi nilai;
  • Validate Icon [boolean] - ikon yang akan ditampilkan pada validasi nilai;
  • Validate Status [Status type] - status yang akan ditampilkan pada validasi nilai;
  • Validate Message [string] - pesan yang akan ditampilkan saat memvalidasi nilai.

RelSelect Get Properties


Contoh penggunaan

Diperlukan untuk mengunduh opsi dropdown dari server untuk melihatnya.

Logikanya harus sebagai berikut:

1.Dapatkan Data Model Array ( Server request GET ) pada pembuatan komponen RelSelect ( onCreate ).

2. Perbarui data dropdown ( RelSelect Update Properties )