Membuat aplikasi upload multiple file dengan Jquery


25-11-2014 23-22-42

Latar Belakang

Jika user ingin mengupload beberapa file sekaligus, maka web programmer harus mencari jquery plugin untuk upload multiple file. salah satu referensi saya adalah yang dibuat oleh Ravishanker Kusuma. Plugins ini juga yang saya gunakan untuk membuat ri32-encoder.

Jika setelah diupload ingin dimasukan ke database alamat filenya, maka silahkan kombinasikan dengan tulisan saya membuat-aplikasi-upload-dan-download-file-dengan-php

Cara Penggunaan

  1. Download plugins, extract dan simpan ke folder htdocs
  2. Jangan lupa buat folder “uploads” , jika tidak maka akan ada error. nama folder “uploads” bisa di sesuaikan dengan yang ada di script file upload.php dan delete.php25-11-2014 23-36-49
  3. Jalankan di web browser misalnya http://localhost/jquery/
  4. Klik tombol “Upload” pilih beberapa file, kemudian klik Open. maka file-file tersebut akan terupload dan tersimpan di folder “uploads”

Setup Plugins

Plugins ini memiliki beberapa setup misalnya :

  • Dapat menampilkan tombol delete file yang telah diupload
  • Filter file yang diupload, misalnya tidak boleh upload file .mp3, .zip, atau file .pdf
  • Jalankan fungsi dragDrop (true/false)

25-11-2014 23-43-27

Jika ingin variasi jquery plugin upload yang lain, bisa mengunjungi situs ini http://designscrazed.org

Referensi :

Sekian artikel dari saya, semoga bermanfaat untuk teman-teman dan anda semua…aamiin

Cilangkap, 25-11-2014

GusnaNuri

Advertisements

Membuat Digit Nominal Angka dengan Javascript


Latar Belakang

Untuk membuat aplikasi keuangan berbasis web, kita membutuhkan tampilan untuk memudahkan user dalam menginput nilai uang. misalnya nilai 150000 saat di input akan terdapat tanda titik pemisah setiap 3 digit menjadi 1.500.000. namn ketika di simpan di database, nilainya tetap tanpa titik pemisah.

Coding Javascript

function kurensi(nilai)
{
bk = nilai.replace(/[^\d]/g,””);
ck = “”;
panjangk = bk.length;
j = 0;
for (i = panjangk; i > 0; i–)
{
j = j + 1;
if (((j % 3) == 1) && (j != 1))
{
ck = bk.substr(i-1,1) + “.” + ck;
xk = bk;
}
else
{
ck = bk.substr(i-1,1) + ck;
xk = bk;
}
}
return ck;
}

function ri32()
{
ttm = document.getElementById( ‘postform’ ).elements[‘jumlah_transaksi’].value;
strtt= ttm.toString();
kttm = kurensi(strtt);

document.getElementById( ‘postform’ ).elements[‘jumlah_transaksi’].value = kttm;
}

Coding PHP

 
Ri32 Community
http://ri32-fungsi.js

 

Download

http://www.4shared.com/zip/_fIDVd2L/bilangan-ri32.html

Sekian artikel dari saya semoga bermanfaat untuk teman-teman dan anda semua…aamiin

Cibubur, 4-6-2012

GusnaNuri

Membuat Mega Menu dengan Javascript


Latar Belakang

Mungkin teman-teman pernah mengunjungi situs bhineka.com. di menu atas terdapat menu yang kita di mouseover muncul banyak sub menu. menu seperti itu disebut dengan Mega Menu.

Mega Menu merupakan perkembangan menu drop down, dan terdiri dari beberapa kolom menu. Mega Menu cocok dipakai untuk menampilkan menu Katalog atau menu yang terdapat banyak sub menu nya.

Download

http://www.4shared.com/zip/G-g8jhID/megamenu-ri32.html

Sekian artikel dari saya semoga bermanfaat untuk teman-teman dan anda semua…aamiin

Cibubur, 5-5-2012

NuriGusna

Membuat Web sederhana dengan XHTML dan XML


Latar Belakang

Selama ini saya membuat web dengan menggunakan PHP dan MySQL sebagai tempat penyimpanan data.

Kali ini saya ingin sharing artikel membuat web dengan menggunakan XHTML dan datanya disimpan kedalam file XML.

Pengenalan XHTML

xHTML adalah sebuah standar baru yang dicetuskan oleh W3C untuk menggantikan standar lama yaitu HTML. Standar xHTML hampir sama dengan HTML yang sudah ada tetapi memiliki aturan-aturan penulisan yang lebih ketat daripada HTML, keduanya merupakan bahasa markup untuk dokumen teks yang berfungsi untuk menentukan struktur dokumen serta mengatur fungsi dan bagaimana dokumen tersebut ditampilkan di browser.

Secara garis besar tujuan utama standar XHTML adalah agar semua halaman web memiliki struktur yang benar dan tata-cara penulisan tag yang konsisten sehingga dapat dibaca dengan baik untuk semua perangkat yang mampu membaca halaman web. Selain itu standar XHTML bertujuan menegaskan fungsinya sebagai pembentuk struktur dokumen sedangkan untuk pengaturan tampilan dokumen di browser (warna, jenis huruf, ukuran dll) diatur dengan menggunakan CSS.

Pengenalan XML

XML merupkan singkatan dari eXtensible Markup Language. XML merupakan markup language seperti HTML, akan tetapi tidak seperti HTML, XML didesain untuk transportasi dan penyimpanan data. XML tidak didesain untuk menampilkan data.

Download

http://www.4shared.com/zip/4ftxqatV/xhtmlku-ri32.html

Sekian artikel dari saya semoga bermanfaat untuk teman-teman dan anda semua…aamiin

Depok, 2-5-2012

noname

Membuat program sandi morse dengan javascript


Latar Belakang :

Waktu saya belajar Pramuka di MTs Al I’anah, saya suka dengan pelajaran sandi karena tidak semua orang dapat membacanya seperti konsep enkripsi. walaupun beberapa sandi sudah menjadi standar komunikasi seperti sandi morse.

Pada artikel ini saya akan membahas tentang aplikasi sandi morse yang dibuat dengan menggunakan javacsript. aplikasi sederhana ini dapat menterjemahkan dari teks menjadi sandi morse ataupun sebaliknya dari sandi morse ke teks.

Belajar Sandi Morse

Untuk memudahkan belajar dan mengkhafal sandi morse, teman-teman dapat membaca artikel cara cepat hafal sandi morse

Sandi Morse ke Teks

function code2Text()
{
var ced3 = “.- +”, i, d, ced5, ced9=””;
var ced4 = window.document.morse.input;
var ced1 = window.document.morse.output;
var ced2 = ced4.value.length;

for(ced5=0; ced5<ced2; ced5++)
{
switch (ced4.value.charAt(ced5))
{
case ‘.’:{ced9 += “.”; break;}
case ‘-‘:{ced9 += “-“; break;}
case ‘+’:{ced1.value += ” “; break;};
case ‘ ‘:
{switch(ced9)
{
case ‘.-‘:{ced1.value +=”a”; ced9=””; break;}
case ‘-…’:{ced1.value +=”b”; ced9=””; break;}
case ‘-.-.’:{ced1.value +=”c”; ced9=””; break;}
case ‘-..’:{ced1.value +=”d”; ced9=””; break;}
case ‘.’:{ced1.value +=”e”; ced9=””; break;}
case ‘..-.’:{ced1.value +=”f”; ced9=””; break;}
case ‘–.’:{ced1.value +=”g”; ced9=””; break;}
case ‘….’:{ced1.value +=”h”; ced9=””; break;}
case ‘..’:{ced1.value +=”i”; ced9=””; break;}
case ‘.—‘:{ced1.value +=”j”; ced9=””; break;}
case ‘-.-‘:{ced1.value +=”k”; ced9=””; break;}
case ‘–…’:{ced1.value +=”7″; ced9=””; break;}
case ‘—..’:{ced1.value +=”8″; ced9=””; break;}
case ‘—-.’:{ced1.value +=”9″; ced9=””; break;}
}break;
}
}
}
}

Teks ke Sandi Morse

function text2Code()
{
var ced3 = “abcdefghijklmnopqrstuvwxyz. “, i, d, f;
var ced4 = window.document.morse.input.value.toLowerCase();
var ced1 = window.document.morse.output;
var ced2 = ced4.length;

for(i=0; i<ced2; i++)
{
i = ced4.charAt(i);
if(ced3.indexOf (i) ==-1)
{
alert(“Please use only letters.”);
break;
}
else
{
for(f=0; f<ced2; f++)
{
switch (ced4.charAt(f))
{
case ‘a’:{ced1.value += ” .- “; break;}
case ‘b’:{ced1.value += ” -… “; break;}
case ‘c’:{ced1.value += ” -.-. “; break;}
case ‘d’:{ced1.value += ” -.. “; break;}
case ‘e’:{ced1.value += ” . “; break;}
case ‘f’:{ced1.value += ” ..-. “; break;}
case ‘2’:{ced1.value += ” ..— “; break;}
case ‘3’:{ced1.value += ” …– “; break;}
case ‘4’:{ced1.value += ” ….- “; break;}
case ‘5’:{ced1.value += ” ….. “; break;}
case ‘6’:{ced1.value += ” -…. “; break;}
case ‘7’:{ced1.value += ” –… “; break;}
case ‘8’:{ced1.value += ” —.. “; break;}
case ‘9’:{ced1.value += ” —-. “; break;}
}
}
}
}
}

Download Aplikasi

http://www.4shared.com/zip/k4bn68W9/sandi-morse-ri32.html

Sekian artikel dari saya semoga dapat bermanfaat untuk teman-teman dan anda semua…aamiin

Depok, 10-02-2012

noname

Menu Accordion Horizontal Jquery


Latar Belakang

Banyak jenis menu yang digunakan untuk navigasi dalam sebuah web. ada yang horizontal maupun vertikal. ada yang berjenis topdown sampai jenis menu accordion yang sekarang saya bahas.  menu ini dibuat menggunakan JQuery.

Potongan Script

<li>

Ri32 Web Blog

Ri32 Web Blog

Berawal dari kesenangan menulis dan mendokumentasikan apa yang sudah dipelajari.
berbagi secercah ilmu sebagai rasa syukur atas nikmat Allah yg tak dapat diukur.
Semoga bermanfaat untuk teman-teman dan anda semua…aamiin 🙂

more →

</li>

*Jika ada content yang ingin ditambahkan, teman-teman tinggal copy paste dan ganti keterangannya.

Download

http://www.4shared.com/zip/NQxEfqtX/profile-ri32-accordion.html

Sekian artikel dari saya semoga bermanfaat untuk teman-teman dan anda semua…aamiin

Depok, 14-01-2012

noname

Javascript untuk bookmark dan proteksi copy halaman web



Latar Belakang

Dalam artikel ini saya akan menjelaskan 2 fungsi javascript yang bisa kita gunakan dalam membuat sebuah halaman web. yaitu fungsi bookmark dan fungsi agar halaman web kita tidak bisa di copy. dengan catatan pengaturan javascript di browsernya dalam keadaan aktif.

Bookmark adalah kegiatan user menandai halaman web di sebuah web browser untuk suatu saat nanti di kunjungi kembali. Untuk bookmark halaman web biasanya kita menggunakan shortcut ctrl+D pada web browser. javascript juga menyediakan fungsi seperti itu. tinggal klik link maka browser khususnya mozila akan muncul kotak bookmark.

Fungsi Bookmark

function addBookmark()
{
bookmarkurl = “http://www.ri32.wordpress.com&#8221;;
bookmarktitle=”Blog Ri32″;
if (document.all)
window.external.AddFavorite(bookmarkurl,bookmarktitle)
else if ( window.sidebar ) {
window.sidebar.addPanel(bookmarktitle, bookmarkurl,””);
}
}

Fungsi Proteksi

if (typeof document.onselectstart!=”undefined”) {
document.onselectstart=new Function (“return false”);
}
else{
document.onmousedown=new Function (“return false”);
document.onmouseup=new Function (“return true”);
}

Klik kanan Copyright

document.oncontextmenu = new Function(“alert(‘Copyright by Agus Sumarna – WebGIS’);return false”);

Implementasi

<body>
Don’t copy this page!
<a href=”javascript:addBookmark();”>Bookmark this page!</a>
</body>

Download

http://www.4shared.com/zip/7tnMvPag/Javascript-ri32.html

Sekian artikel dari saya semoga bermanfaat untuk teman-teman dan anda semua…aamiin

Depok, 22-12-2011

noname

%d bloggers like this: