Hallo teman-teman Dumet School. Kemabli lagi dengan saya di kursus web design. Kali ini saya akan membahas tentang Cara Memanfaatkan Fungsi Sortable Pada Jquery UI. Fungsi dari sortable yang ada pada jquery UI adalah untuk dapat mengatur ulang suatu elemen yang ada di dalam list atau grid dengan menggunakan mouse. Dan di dalam metode sortable ini memungkinkan bagi kita untuk dapat saling menukarkan posisi dari suatu elemen dengan elemen lainnya.

Oke untuk dapat mengetahui Cara Memanfaatkan Fungsi Sortable Pada Jquery UI, kita buat terlebih dahulu struktur htmlnya seperti pada script di bawah ini ya teman-teman.

Jika sudah maka teman-teman jangan lupa untuk menambahkan link jquery UI nya. Teman-teman bisa salin beberapa link berikut ini.

Dan langkah terakhir untuk dapat mengetahui fungsi sortable pada jquery UI adalah membuat script jquery dengan fungsi sortable, teman-teman bisa salin script di bawah ini.

Nah jika teman-teman perhatikan script di atas, disini saya memanggil selector id dengan nama sortable-1 yang mana selector tersebut saya berikan fungsi sortable agar list yang ada di dalam ul dapat kita pindah atau tukar posisi elemen satu dengan elemen lainnya.

Jika teman-teman tampilkan di halaman browsernya maka akan tampak seperti pada gambar di bawah ini.

Cara Memanfaatkan Fungsi Sortable Pada Jquery UI

Dan jika kita pindahkan dengan cara di drag menggunakan mouse sesuai no urutnya maka akan menjadi seperti gambar di bawah ini.

Cara Memanfaatkan Fungsi Sortable Pada Jquery UI

Demikian artikel tentang Cara Memanfaatkan Fungsi Sortable Pada Jquery UI. Semoga bisa bermanfaat dan selamat mencoba.

WhatsApp chat