Skip to main content

Posts

Showing posts with the label Javascript

Javascript : Checkbox Toggle (Pengganti Radiobutton)

 Kebutuhannya sederhana, ada banyak checkbox, tapi hanya bisa memilih satu saja.  Misalnya kita punya tabel data, tiap baris ada checkbox, hanya saja dibatasi hanya ada satu yang bisa dicentang. Saat satu baris dicentang (checked), maka yang lain otomatis dihilangkan centangnya (unchecked). // function to uncheck other checkboxes using javascript only function uncheckOther(obj)  {   if (obj.checked) {   var inputs = document.getElementsByTagName("input");   for(var i = 0; i < inputs.length; i++) {     inputs[i].checked = false;    }     obj.checked = true;   } }    Terus di tag checkbox-nya panggil fungsi tersebut: <input type="checkbox" id='test1' value="abc" onclick="uncheckOther(this)"> Sebenarnya kalau di halaman web biasa, aku bisa mengganti checkbox dengan button atau link di tiap barisnya, langsung ada ID. Masalahnya, pas aku coba pakai ini di Visualforce page (Salesforce) aku mengalami kesul...

Menampilkan Angka dengan Format Ribuan dan Pecahan

Masalah sepele : ingin menampilkan angka seperti 12345.57 jadi 123,45.57 (untuk saat ini dibatasi hanya 2 desimal). Karena masalahnya sepele, algoritmanya juga harusnya sepele. Tapi sering lupa, jadi mending aku tulis di sini sekedar jadi pengingat. PHP Kalau di php simple, cukup pakai sintaks number_format(Angka, Jumlah Decimal) Lengkapnya bisa dilihat di sini  http://php.net/number_format JAVASCRIPT Sepertinya di javascript belum ada fungsi bawaan yang standard, jadi terpaksa bikin sendiri. Agak gak efektif memang, tapi biarlah. function currFormat(decAmount)   {     strSymbol = (decAmount < 0) ? '-' : '';     decAmount = Math.abs(decAmount);     decAmount = Math.round(decAmount * 100);     dec1 = Math.floor(decAmount / 100);     dec2 = decAmount - (dec1 * 100);          str1 = dec1.toString();     str2 = dec2.toString();        ...

[Javascript] Get Next Date

// fungsi untuk mencari tanggal berikutnya dari sebuah tanggal. // input: tanggal (string) dengan format DD/MM/YYYY (string), // durasi (integer) untuk berapa hari yang akan ditambahkan // output: tanggal (string) yang merupakan tanggal awal ditambah N hari, jika data valid function getNextDate(date1, duration) { date1 = date1. split (strDateDelimiter); // memenggal bagian-bagian tanggal, pisahkan tgl, bln, thn sDate = new Date (date1[ 1 ]+ "/" +date1[ 0 ]+ "/" +date1[ 2 ]); // buat objek tanggal x = sDate. getTime (); // ambil nilai integer (detik) dari objek tanggal tersebut x = x + parseFloat (duration * 86400000 ); // cari nilai detik setelah ditambahkan dengan hari yang dicari sDate. setTime ( x ); // isikan nilai yang diperoleh ke objek tanggal, sehingga nilai tgl berubah date2 = sDate. getDate () + "/" + (sDate. getMonth () + 1) + "/" + sDate.getFullYear(); // generate string tgl return date2; } Contoh penggun...

[AJAX] My first ajax script

Akhirnya aku belajar memanfaatkan Ajax , untuk aplikasi berbasis web. Sebenarnya sudah lama pengen ngoprek, dan memanfaatkan kehebatan teknologi ini, tapi karena terlalu sibuk, ampe gak sempat. Untunglah, ada Ko' Dedi yang rajin, aku tinggal contek dan pelajari aja script itu. Script ajax pertama ini kupakai di website pribadiku , dan masih cukup sederhana. Intinya cuma mengambil content dari server saat ada trigger (menu di-klik), dan langsung menampilkan hasil yang di terima ke tempat tertentu (DIV). Aku belum sampai belajar memproses parsing data yang cukup kompleks, dalam format XML ataupun format lainnya. // deklarasi variabel global var http = createRequestObject(); // untuk manampung http request .. langsung dibuat var objRefresh = 0 ; var isBusy = false ; var x = 0 ; var busyText = "Loading data, please wait ... " ; // fungsi ini digunakan untuk membentuk objek http request, terlebih dulu memeriksa // jenis browser, karena tiap browser ...

[Javascript] InnerHTML problem di IE

Di detik-detik terakhir, malah nemu masalah. Beberapa fitur programku gak bisa berfungsi jika browsernya IE, baik IE5.4 atau IE5.5 ke atas. Masalahnya sepele, perintah obj.innerHTML = "xxx"; gak bisa dijalankan, alias error :( Selidik punya selidik, setelah beberapa kali trial and error, ketemu juga masalah. Ternyata perintah assignment value pada innerHTML tidak dapat dilakukan pada objek <tr> . Kalau di Firefox, bisa-bisa aja. Tapi kalau objeknya <div>, <p> dan blok paragraf lain (termasuk <b>), bisa diassign value, baik di IE maupun Firefox. Sampai tengah hari baru ketemu masalahnya .:)

Javascript :: Masalah sederhana dengan ParseFloat

Hari ini menemukan sedikit masalah dengan penjumlahan/pengurangan bilangan dengan Javascript. Sebenarnya cuma sederhana, cuma mengurangkan nilai X ke nilai Y. Hanya saja nilai X dan Y diambil dari text input. Sayangnya, alih-alih mendapatkan hasil numerik, malah mendapatkan nilai string. misal: document.form1.total.value = document.form1.x.value + document.form1.y.value; //x bernilai 20 dan y bernilai 50. Hasilnya bukannya 70, melainkan 2050. Kalau di PHP, aku tinggal memberikan (int) di depan variabel. Pas dicoba ternyata gagal. Karena agak bingung, mungkin masalah ini sepele tapi ternyata bikin pusing, ditemukan satu trik dengan memanfaatkan fungsi parseFloat. document.form1.total.value = parseFloat(document.form1.x.value) + parseFloat(document.form1.y.value); Baru deh , hasilnya normal = 70. Ada cara yang lebih sederhana dan bagus?????

Panoramic Image Viewer

Pagi-pagi Nanang udah nanya, apa bisa kliping image (entah istilah dari mana, aku sendiri bingung he hehe ..) pakai Javascript. Intinya sih, gimana caranya, sebuah gambar yang besar, bisa ditampilkan satu bagian tertentu (jadi seperti meneropong), terus sekelilingnya ada tombol untuk menggeser gambar itu. Jadi kotak peneropong tetap, tapi kalau tombol (up,down,left, right) dipencet, maka gambarnya akan geser seperti keinginan. Kepikiran untuk buat sendiri, tapi ternyata gak semudah yang dibayangkan. Coba aja cari dulu di internet, siapa tahu ada. Yang pertama kepikiran adalah lihat contoh javascript di server (yang dulu pernah ditaruh sama Arif). Karena merasa kurang lengkap, coba langsung ke sumbernya, di http://javascript.internet.com . Eh, malah di halaman pertama langsung ketemu. Thanks, God! Linknya di sini: http://javascript.internet.com/miscellaneous/panoramic-image-viewer.html Lumayan juga.