• Home
  • /
  • Tag Archives:  Javascript

Auto Click Object dengan Timer Menggunakan JQuery dan Javascript

Artikel ini direquest oleh salah satu pengunjung blog ini, yang memanfaatkan layanan article by request. Artikel yang diminta adalah tutorial bagaimana membuat script yang secara otomatis melakukan klik pada suatu obyek tertentu dalam sebuah laman web berdasarkan waktu yang telah ditentukan.

Sebagai contoh misalkan di laman web tersebut terdapat dua buah gambar, misal image1 dan image2. Selanjutnya diharapkan secara otomatis ada sebuah script yang mengklik image1 pada waktu tertentu, dan juga akan mengklik image2 pada waktu yang lain.

Untuk solusi permasalahan tersebut, kita bisa menggunakan jQuery dan Javascript.

Script Multiple File Upload Dengan PHP

Beberapa waktu lalu, saya pernah menulis artikel mengenai cara membuat script upload file ke folder yang berada di server. Akan tetapi, script upload file yang dibahas di situ hanya bisa mengupload sebuah file dalam sekali upload. Sehingga bila kita ingin mengupload 5 buah file, maka kita harus lakukan langkah yang sama berulang-ulang sebanyak 5 kali.

Nah… tidak bisakah kita membuat script yang memungkinkan kita bisa mengupload lebih dari satu file sekaligus? Oh tentu bisa donk. With programming, everything is possible ๐Ÿ™‚

Hal itulah yang akan dibahas dalam artikel kali ini.

Teknik Membuat Script Mengubah Ukuran Image dengan Javascript

Pada artikel kali ini, saya akan mencoba menjelaskan bagaimana teknik membuat script mengubah ukuran image dengan DOM di Javascript. Hal ini pernah saya jadikan tugas bagi mahasiswa saya yang mengambil matakuliah pemrograman web. Tapi sudah lama kok ๐Ÿ™‚

OK… Karena menggunakan Javascript, sehingga dalam hal ini prosesnya tidak perlu melalui request ke server namun hanya terjadi dalam client saja. Oleh karena itu proses resizing image ini dapat dilakukan dengan cepat.

Hmm… adapun skenario mengubah ukuran imagenya sebagai berikut. Dalam halaman web muncul sebuah image, kemudian terdapat 3 buah tombol atau button. Tombol pertama (+) digunakan untuk memperbesar ukuran image menjadi 2 kali sebelumnya. Tombol kedua (-) untuk memperkecil ukuran image 1/2 kali sebelumnya, dan tombol ketiga (=) untuk mereset ukuran image menjadi ukuran aslinya.

Ide Membuat Pembatasan Jumlah Karakter Pada Form dengan Counter

Ada seorang member saya, mas Sarjito, menanyakan bisakah membuat script untuk membatasi jumlah karakter yang diinputkan pada sebuah form sebelum input tersebut disubmit. Jawabannya adalah bisa mas Jito, yaitu menggunakan Javascript.

Ide konsepnya adalah mirip seperti kita mengirim SMS via handphone.

Sebagai contoh misalkan kita batasi jumlah karakter yang bisa diinputkan adalah 250 buah. Supaya informatif, sebaiknya dalam form terdapat semacam counter yang menunjukkan berapa karakter lagi yang bisa dituliskan. Karena kita batasi jumlah karakternya ada 250, maka nilai awal counternya adalah 250. Setiap kali kita mengetikkan karakter pada form tersebut, jumlah karakter tersebut akan terus berkurang sampai dengan 0 yang artinya karakter tidak bisa ditambah lagi.

Bagaimana cara membuatnya? simak artikel menarik berikut ini.

Membuat Pilihan Combobox Dinamis Tanpa AJAX

Ada salah seorang rekan (mas Arif Budiman) yang sekaligus menjadi member saya menanyakan “Bisakah membuat pilihan combobox dinamis tanpa menggunakan AJAX?”.

Beliau menggambarkan kasusnya sebagai berikut:

Misalkan terdapat dua buah combobox. Combobox pertama berisi pilihan tentang spesialisasi dokter, serta combobox kedua berisi pilihan dokter yang sesuai pada spesialisasi dalam combobox pertama. Sebagai contoh misalkan pada combobox pertama dipilih spesialisasi penyakit dalam, maka secara otomatis dan langsung pada combobox dua menampilkan daftar pilihan dokter yang spesialisasinya penyakit dalam. Adapun data yang ditampilkan pada kedua combobox disimpan dalam database MySQL sehingga tidak bersifat statis.

Memang solusi yang bisa dipilih untuk menyelesaikan kasus di atas adalah dengan AJAX (Asynchronous Javascript and XML). Namun… bagi yang belum paham tentang AJAX, jangan khawatir.. ada kok solusi lainnya yaitu dengan menggunakan gabungan Javascript DOM dan PHP.

Mau tahu caranya? Nah… simak lebih lanjut artikel ini ๐Ÿ™‚

Tentang DOM di Javascript

Setelah banyak menulis artikel tentang PHP, saya akan coba menulis tentang Javascript. Bukannya jenuh menulis tentang PHP, namun ada beberapa konsep dalam Javascript yang sedikit-sedikit saya kuasai meskipun tidak canggih-canggih amat sih :-), sekaligus sedikit refreshing dengan sharing ilmu baru he.. 3x

Dalam artikel ini saya akan coba bahas mengenai DOM di Javascript. DOM di sini merupakan singkatan dari Document Object Model. DOM adalah standard atau platform terbaru dari W3C (World Wide Web Consortium) yang memungkinkan untuk mengakses dan mengupdate dokumen HTML secara dinamis. Tidak hanya konten dokumen saja yang bisa diakses dan diupdate dengan DOM namun juga struktur beserta stylenya.