Pada ulasan lalu, kita telah mengulas tentang serangan XSS. Pada ulasan tersebut kita membahas cara menangkal serangan tersebut dengan melakukan filter pada elemen form. Akan tetapi.. sebenarnya untuk hal sederhana seperti jika kita menggunakan editor khusus, kita sudah tidak perlu lagi melakukan filter tersebut. hanya saja kita sebaiknya tidak memasang editor tersebut pada seluruh textfield.
Pada gambar diatas, Anda dapat melihat sebuah editor khusus ala MS.Word. Jika menggunakan editor ini, semua tulisan Anda akan dikonversi menjadi tag HTML sehingga Anda tidak perlu repot-repot lagi melakukan filter. Contohnya :
CONTOH akan diubah menjadi <b>CONTOH</b>
<b>CONTOH</b> -> akan diubah menjadi <b>CONTOH</b>
Ulasan kali ini kita belum akan Membahas Editor TiniMCEPUK yang terlihat sepeti gambar diatas. Namun kita hanya akan membahas NICeditor yang sangat sederhana. Kenapa demikian?? karena artikel ini akan penulis gunakan untuk contoh kasus pada ulasan berikutnya dengan kombinasi beberapa artikel lain sebelumnya.
Dalam beberapa kasus, kita tidak perlu menggunakan editor yang rumit. Contoh Apabila kita hanya ingin membuat sebuah sinopsis sebuah buku. Pada sinopsis itu biasanya kita hanya memerlukan tulisan dengan kombinasi huruf bold, italic, underline dan beberapa variasi yang sederhana, Jika menggunakan editor yang besar, penulis merasa akan sangat memboroskan resource.
Ok langsung saja. pertama, seperti biasa bukalah editor kesayangan Anda (dalam ulasan ini penulis menggunakan DW4). Selanjutnya buatlah form dengan sebuah textarea dan sebua tombol submit. jangan lupa simpan dan beri nama “NICeditor.php”
Selanjutnya, downloadlah library NIC editor disini http://nicedit.com/
Jika sudah, extraklah file zip tersebut dan tempatkanlah 2 buah file berikut pada direktori source kode Anda berada. File yang kita butuhkan adalah :
1. nicEdit.js
2. nicEditorIcons.gif
Jika koda-koda yang telah disebutkan diatas telah berada dalam 1 folder, sekarang ketikan kode berikut pada editor Anda di dalam tag
<script type="text/javascript" src="nicEdit.js"></script>
<script type="text/javascript">
bkLib.onDomLoaded(function() { nicEditors.allTextAreas() });
</script>
Nah.. sampai disini coba jalankan script Anda. Jika tidak ada masalah seharusnya Anda akan mendapati tampilan seperti berikut :
NB : Jika Anda medapati gambar tidak muncul pada toolbar NIC editor, berart Anda harus menggunakan Editor Versi lama. Untuk mendapati editor lama, Anda dapat mendownloadnya beserta contoh kodenya disini
Ok, sampai disini dulu ulasan kita, Be Creative, Be Inovative n Keep Creation. :p
Ronald Rusli
http://jambispirit.com
jambispirit@gmail.com
kalo tidak bisa nyimpan di database kira2 salahnya apa ya?
kalo nice edit tidak diaktifkan, textarea biasa bisa ngirim..
Bisa di post sedikit kode simpan a mas? :)