Belajar PHP untuk PEMULA | 22. LIVE SEARCH (menggunakan JQUERY)
HTML-код
- Опубликовано: 28 сен 2024
- Membuat fitur LIVE SEARCH menggunakan jQuery.
---
PLAYLIST PHP DASAR UNTUK PEMULA
• Belajar PHP untuk PEMULA
---
PLAYLIST LAIN:
- Javascript Dasar
• Dasar Pemrograman deng...
- HTML Dasar
• HTML Dasar
- CSS Dasar
• CSS Dasar
- Tutorial Sublime Text
• Tutorial Sublime Text 3
- CSS Layouting
• CSS Layouting
---
MEDIA SOSIAL
- / webprogrammingunpas
- codepen.io/webp...
- github.com/san...
- / sandhikagalih
- / sandhikagalih
---
TEKNIK INFORMATIKA
UNIVERSITAS PASUNDAN BANDUNG
if.unpas.ac.id
---
terimakasih dan selamat #ngoding!
@sandhikagalih
1:06 Harusnya saya pak yang mengucapkan banyak" terimakasih :) . Ga kerasa udah banyak ilmu yg saya dapatkan dari pak Sandhika, Semoga video pak sandhika dapat berguna bagi banyak orang, dan semoga pak Sandhika selalu diberi kesehatan 🙏, Sukses terus !
nah betul ..
betul
betul sekali, saya juga langsung berpikiran sama spt anda, ketika begitu tulusnya seseorang memberikan ilmu kpd orang lain, justru mereka yg merendahkan diri/ tawadhu dg mengucapkan terima kasih, karena memang Pak Dhika Insyaa Allah yg akan menerima amal jariyah, dari setiap kita yg mempelajari & menerapkannya, semoga senantiasa diberikan kesehatan & kesabaran untuk mengupdate/ upload materi terbaru seputar programming, Aamiin..
Setuju sekali
Guaa jugaaaa trimakasih banyak ke pak dhikaaa woeee
Terimakasih pak sandika sudah berbagi ilmu ke semua orang melalui channel ini semoga sehat, bahagia dan selalu dalam lindungan Tuhan
Video kali ini menghibur bgt pak😅, terima kasih banyak udh share ilmunya🙏, udh ngikutin dari html, css, dan sejauh ini betah bgt bljr ngoding di channel ini, semangat terus bikin videonya pak👍
3 hari dari php 1 - 22. So enjoyable nonton videonya sambil praktek bareng
Halo pak, akhirnya upload lagi, udah di tunggu tunggu. Terima kasih pak semoga sehat terus biar lancar upload tutor nya
Alhamdulillah sudah sampai sini. Terima kasih om Dhika atas ilmunya. 😄🙏
banyak nih ilmu yang dapat dari bg Shandika(WP). Sekalian dong bg tutorial signin menggunakan google API atau facebook SDK. di tunggu bg hehehe. Terimakasih banyak :)
Keren pak Dika , bisa membuat sesuatu sesuai keinginannya
Terima kasih pak, semoga saya suatu saat diberi kesempatan untuk berterima kasihlangsung kepada bapak. salam dari saya di Jakarta
pak buat tutor buat bikin template blogger dong dari awal ampe jadi 😬😬😬. kayaknya struktrunya beda, bingung klo baca dri mbah google, kode nongol aja tpi ga dijelasin dri mana itu kode, penjelasannya kurang detail. disini biasanya tiap kode dijelasin. moga dapet pencerahan disini 😂😂..
contoh. ambil dri mbah google.
style css.
#sidebar{padding:5px}
.sidebar h2,.sidebar h3{color:#fff;padding:4px 8px;background:#3384cc;background:linear-gradient(top,#3384cc,#2a79bf);background:-webkit-linear-gradient(top,#3384cc,#2a79bf);background:-moz-linear-gradient(top,#3384cc,#2a79bf);background:-o-linear-gradient(top,#3384cc,#2a79bf);font-size:11pt;font-family:'PT Sans',Arial,sans-serif;border-bottom:2px solid #ccc;text-shadow:1px 1px 0 #283744;margin:0;margin-bottom:5px}
(Html pada bagian body)
itu pada bagian css. gimana cara ngebaca kodenya.
kok bisa nongol aja??
.sidebar h2,.sidebar h3
dari html sampai php ngikuti terus ... saya mulai paham dengan semua ini :D .. trima kasih pak tutornya ... #haus_akan_tutor_pak Sandika :D
terima kasih banyak pak. atas sharing codingnya
Senantiasi menunggu playlist Jquery pak dhika ...
ijin sharing, saya jalankan programnya dengan jquery-3.5.1.min.js di google chrome gak bisa, ternyata setelah di jalankan di mozille firefox baru bisa. terima kasih pak sandhika ilmunya sangat membantu
saya mendapatkan masalah yg kurang lebih sama tntang materi ini,kan pemanggilan jquery dipindahkan keatas dan pakai fungsi document ready di script.js tapi tidak trjadi apa2 ketika melakukan pencarian live search di browser chrome,apa yg salah ya ?
btw saya pake jquery 3.6.0
Terimakasih pak, sehat selalu 👍
engga pernah bosan pak
Nice pak sukses selalu haturnuhun ilmu na
Pak, saya pakai jquery 3.5.1, apa script nya beda? ini gk jalan. tombol cari aja gk hilang.
sama gan, setelah ubah ke jquery 3.2.1. akhirnya bisa.
link donwload blog.jquery.com/2017/03/20/jquery-3-2-1-now-available/
Bro kasusnya jQuery ajax nya ga jalan pas di coba di chrome kalo pake versi yang 3.5.1?
Ijin bertanya pa, kenapa tombol cari saya tidak bisa hilang yah?
terima kasih 🙏
mantap massss dika .... di tunggu video video kerens lainyaaa hheheheeh
tutor membuat php notification ya pak.. ditunggu waktu dekat2 ini upload nya.. makasih
terimakasih pak atas semua tutorialnya
pak saya mau request satu yang sederhana tapi penting pak ... bisa kah pak dhika membuatkan video tentang Absolute Path dan Realtive Path pada PHP.. mana yang lebih baik dan bagaimana cara melakukannya.. Terimakasih Sebelumnya pak semoga terbaca dan di acc :D
thanks pak
punya gw malah muncul begini ya?
udah coba ikuti lagi video ini daria wal tetap muncul
padahal pas di seri ajax ga ada masalah
Notice: Undefined index: keyword in G:\Program Files\xampp\htdocs\phpdasar\pertemuan20jquery\ajax\mahasiswa.php on line 4
Ka reques tutorial pembuatan aplikasi iventory barang berbasis web dengan bootstrap
Trimakasih 😊
Hatur nuhun pak
Bang mana video barunya lagi pengen blajar lagi nii dari bang dika trimakasih
Pak sandhika kenapa punya saya codingan sudah betul, library juga sudah betul, tapi pada saat dijalankan tidak bisa, tombol cari PU tidak bisa dihapus, dan pada saat console eror
di tunggu framework phpnya pak........
Numpang duduk mantengin videonya pak 😄
Terimakasih pak Dhika ilmunya sangat bermanfaat...
Di tahap ini Sy sudah mengikuti panduan dr pak Dhika dan hasilnya semua lancar...
Yang jd permasalahannya sy coba menggunakan database yang berisi lebih dr 5 juta baris dan hasilnya loading nya lama banget...
Apakah ada saran/tips dr bapak untuk memperbaiki loading yang lama dalam live search ini...
Terimakasih...
ketika tekan enter, tampilannya balik ke awal lagi pak
Assalamualaikum Pak, syntax jQuery saya ga jalan pak, bagian show() sama hide()
Gimana bro masih gk jalan?
@@fadlisabda buset dah itu 8 bulan yg lalu :(
@@alifnurrohman9940 masih ingat gak bro?
yang gabisa di menit 18:18
.on('keyup'), function () { diganti jadi .keyup(function() {
bingung nyari errornya dmn gara2 gaada pesan errornya, emg perlu buka dokumentasi jquerynya wkwk
Pak buatin tutor cara export data dari database ke excel/PDF dengan php dong :)
pak, pas menit 24.00 itu kan muncul kembali icon loading nya. tpi kok punyaku ga bisa muncul kembali ya, pdhl syntak nya sudah semirip mungkin dg yang pak dika buat
mantapp bet dah
boleh request om, saya mau reuqeus pencarian data tapi menggunakan metode "ElasticSearch". seperti pencarian di google dan wikipedia. dan hasil pencarian nya itu bisa klik seperti di google
pak tolong d lanjutin lagi ya video php nya sampai bener" bisa bikin web nya karena saya bener" suka sama video ini dan saya ingin bener" belajar bahasa pem php??
Pak cara mengimplementasikan Jquery pada laravel nih pak
bang, mau nanya, saya coba utak atik theme wordpress, tp ada masalah, kenapa post thumbnail gambarnya tidak jernih, dan thumbnail di relatedPost nya juga sama, gambarnya jadi nge blur, itu masalahnya dimana ya, ... maaf di luar topik bang
pak mohon buat tutorial oop pak . karna sekarang lagi ngetrennya oop pak
pak sandikha mana tutornya lagi nih,,
Sebelumnya saya ucapin Terimakasih buat Pak Dhika,
Saya mau nanya Pak, Fungsi keyup saya kok tidak jalan ya setelah saya pakai Jquerynya...?
Mohon bantuannya ya....
Thanks!
Pak, kenapa pake $.get malah ga jalan live search nya? 24:45
mas andhika,saya ada trouble ketika pemanggilan file jquery nya diletakkan diatas,malahan gak bisa menggunakan live search nya jadinya,tapi ketika diletakkan dibawah untuk pemanggilan file jquery nya malah bisa melakukan live search nya...tolong dibantu mas salahnya dimana ya ???,ini udah kali 3 nya saya mengulang2 videonya tapi ttp aja begitu
ganti browser, mungkin itu emang jquery-nya.
saya pakai microsoft edge bisa, tapi pakai opera tidak bisa.
pak dhika sy kenapa jadi ga tampil loadernya setelah dimasukan ke script.js
kang dhika kok tidak ada video minggu ini 😇
bang,gimana caranya agar data yang di index.php hanya bisa keliatan data yang di input oleh masing masing user itu sendiri ? karna kalau di tutorial inikan masing2 user bisa liat semua datanya. takutnya ada yang iseng menghapus data user lain
bang, saya jquery nya gak berfungsi gimana ya bang ?
sama nih, pakai javascript yg di pertemuan 19 jalan tapi yg di pertemuan 20 malah ga tampil pas di ketik
Pa Shandika Minggu ini tdk ada video tutorial ? :(
Pak kok punya saya bagian addEventListener-nya cannot property yah ? Gimana solusinya pak, saya sudah udah bolak balik ngulang video soalnya
kalau gak salah cara ini adalah client side, apakah ada cara menggunakan server side ?
Assalammualaikum pak Dika, pak ko saya live searching pas diketik gk tampil iyah, tapi kalo di enter baru tampil searching nya
Coba ganti script src jquery nya sama
Taro di head
pa kalau loading nya di dalam inputan search nya gmn ya?
Apa ada rencana untuk membahas atau membuat study case dengan Framework JavaScript yang sedang hype di 2018, pak?
kalo rencana, ada Jeremy.. :)
kapan? nah itu belum tau.. hehe
kak sarannya apa apa yang bagus dimasukkan di database ^_^ mohon bantuannya soalnya w gak baik dalam memikirkan database :'0
Halo pak, maaf seandainya ini sangat terlambat ditanyakan, saya baru mengikuti materi bapak akhir-akhir ini.
Ketika menggunakan $.get, kan seperti ini ya pak:
$.get('ajax/cars.php?key=' + $('#keyword').val(), function(data)
Nah, saya masih bingung, function(data), data nya itu apa dan dia fungsinya untuk apa pak? Jika berkenan boleh dijelaskan... Terimakasih pak
Wah, ternyata data itu = xhr.responseText ya pak? Apa benar?
Pak kalau mau nyimpan sidik jari di database mysql bisa tidak ya? Jadi pencarian datanya berdasarkan sidik jari
pak dhika, disitu kan loadingnya pakai img gif. Nah kan saya pakai materialize frameworks
terus kodenya seperti ini
nah nulis classnya di file jsnya gimana pak?
//munculkan icon loading
$('.progress.indeterminate').show(); ???
Kok ga dijawab pak dhika?
@@dickybenwijaya6869 langsung class img nya
$('.loader').show();
pa dhika ko punya saya pas udah ngetik nyari tuh gambar nya tetep muncul ngga ilang, itu gmna yaaa
pak dika mau nanya dong , apakah beda jquery nya beda versi pengaruh tidak? soalnya fungsi .hide() saya tidak jalan di chrome , sedangkan make avast browser fungsi .hide() bisa , tapi $('#container') nya tidak jalan. mohon bantuannya pak
Sama , saya juga ngga bisa fungsi hide nya 🤔
@@detaandriyan320 berarti di perbarui sama jquerynya, liat aja documentasinya gan.
sama gan, tapi setelah ubah ke jquery 3.2.1. akhirnya bisa.
link donwload blog.jquery.com/2017/03/20/jquery-3-2-1-now-available/
maaf pak dhika, kalau proses download file gmn ya pak?, kalau bisa video ya pak!
mas dika.. kalau data nya json gimana ya mas? sama aja kali ya mas?
ditunggu framework php nya
maaf pak , kalau proses download file gimana ya pak?, kalau bisa video ya pak!
Di folder ajax nya
pak addEventListener nya ga kebaca pak itu gimana ya?
cek lagi nama / id elementnya
Xampp blom nyala kli
Bagus buat kulliah, karna semesrer udh tinggi 😂
27:56 Ngetes tanpa pake sleep bisa pakai fitur throttling di Chrome pak lebih mudah prnt.sc/ubzhdq
bisa bantu pak.. jquery saya ko ga bisa bisa ya
jquery yg di download versi terbaru jquery-3.3.1.min
di script
var keyword = document.getElementById('keyword');
keyword.addEventListener('keyup', function() {
console.log('ok');
});
di console.log nya ga ada muncul apa apa kososng aja pesan error juga tidak ada
di index
Halaman Admin
Logout
Daftar Mahasiswa
Tambah data mahasiswa
Cari...
No.
Aksi
Gambar
NRP
Nama
Email
Jurusan
itu sebetulnya belum pakai jquery, masih javascript biasa.. coba buka consolenya, lalu ketikkan sesuatu di input keywordnya.. harusnya setelah kamu ketik, baru muncul pesan 'ok' nya
@@sandhikagalihWPU ok pak sudah muncul setelah sy biarkan dan matikan pc seharian.. dan sy coba ulang lagi tulis lengkap jquery nya tetep munculnya ok juga tidak muncul hasil pencarianya sy kira ini cokies sebelumnya nempel di broser sy.. sehingga walaupun saya matikan semua kode di script tetep muncul perintah sebelumnya tidak update...
adakah cara untuk menghapus cokies di browser.. uda sy delet history dengan ctrl shift delet uda close win tetep muncul yg sama
jquery nya saya tulis seperti ini
$(document).ready(function() {
//hilangkan tombol cari
$('#tombol-cari').hide();
//even ketika keyword ditulis
$('keyword').on('keyup', function() {
//munculkan icon loading
$('.loader').show();
//ajax menggunakan load
//$('#container').load('ajax/mahasiswa.php?keyword' + $('keyword').val());
//$.get()
$.get('ajax/mahasiswa.php?keyword=' + $('keyword').val(), function(data) {
$('#container').html(data);
$('.loader').hide();
})
});
});
Assalamualaikum. Pak mau bertanya
Untuk searching ini apa hanya bisa di masukan satu kata saja pada keywordnya.?
bisa lebih dari 1 kata
Untuk hasil pencarian nya agar kata yang di cari bisa di tandai dengan bold / warna gmna ya pak caranya 😅. Terimakasih pak 🙏
hadir
pak dhika, kok klo nyari kalimat yang pake spasi malah gak muncul ya hasilnya ? harus pake tanda "_" buat spasinya. kasih solusinya dong pak dhika.. terima kasih
sama, apa udah nemu solusinya?
sama nih udh diulang ulang videonya tpi hasilnya tetep sama
mas.apakah semua tag PHP 7 yang ada di tutorial PHP nya MAS berbeda dengan PHP 5?
saya mau belajar php 5 tapi apakah tag yang saya pakai dari tutor nya mas bisa berjalan di PHP 5?
selama yang kamu install diatas 5.3 PHP nya gak masalah.. :)
pak jquery kapan??
Bagian 19:30 dan 23:46 kok punya saya ga bisa di .hide(); sama .show(); ya?
iya sama wkwk, keknya grgr versi kita udah versi terbaru sih, sedangkan punya pak Dhika masih versi tahun2 sblom kita
sama. knp ya
@@marcelloyoel1014 tapi punya tmen saya bisa kok muncul. tpi punya ku ga bisa. knp ya itu, pdhl syntak nya udah bener
dukung jquery pak :D
addblock buat jquerynya tidak berfungsi, pke browser yg lain berfungsi hehe tp punya bapak ada addblock jg masih berfungsi. sungguh aneh tp nyataaa
pertamaxxz
buat series python tak nanti?
sepertinya tidak.. :)
Fungsi # dalam $('#keyword') itu apa sih pak?
itu sma dgn Javascript getElementById
Pak dhika ditunggu seri jquery nya, sehat terus pak dhika.....
Semoga rejekinya terus mengalir seperti ilmu yg dibagikan. Amiiiiim
pak, kalau halamannya berupa pagination apakah bisa juga dilakukan live search dengan cara seperti ini?
ya Allah, semoga bapak di berkahi Allah SWT.
Aamiin..
bener bener tidak terasa sudah mau selesai seri PHP, digarap deh semua yang ada di RUclips pak galih,
sambil kerja jadi hanya kalau lagi senggang aja nih hufft -_,
tp alhamdulillah sudah sedikit demisedikit faham baik variablenya, logikanya dll, mau jadi developer :D.
biar kerjany lebih baik lagi
POKOKNYA TERIMAKASIH PAK GALIH, SEHAT SELALU, SUKSES SELALU
Pak dhika dan teman2 semua, mau nanya, kalo saya mau agar tabel nya dr awal di sembunyikan, trus tabel hanya muncul saat data yg dicari itu ada. Terus kalo kolom pencariannya kosong atau data yg dicari tidak ada, tabelnya di sembunyikan lagi. Saya sudah berhasil sembunyikan tabel dan saat data dicari data muncul, tapi saat kolom pencarian nya dikosongkan, tabelnya tetap ada dan semua data muncul. Mohon bantuannya, terima kasih..
Clear bgt pak mantap !!, pak ane request tutorial crud realtime (bukan ajax / request response), tapi bener" realtime kaya chatting pake node.js, udh cari" di gugel blm ngerti juga
thx pak :)
pak dika kita kan menulis scriptnya ada di folder js/script.js, saat menjalangkan fungsi load, kenapa direktorinya ga keluar 1 folder dulu(../ajax/mahasiswa.php) namun malah langsung masuk ke folder ajax (ajax/mahasiswa.php) ? sedangkan direktori saat menulis script.jsnya ada pada direktori (js/script.js)
punya saya pakai jquery di menit 18:18 tidak tampil apa2 kenapa ya? sedangkan kalo pakai metode pertemuan 19 jalan
boleh dibantu pak sandika,
punya sya swaktu menjlakan live searching jquery di mozilla tidak bisa.
tp waktu sya running di chrome bisa..
stelah itu sya lnjut pakai chrome ni..
namun fungsi loader nya tidak.
tp kalau sya pindah k mozilla loadernya jalan.
namun live searching nya tidk bisa juga...
Hmm, ada yang aneh, saya mengalami masalah pas nyembunyiin tombol cari dan nampilin loading padahal udah ulang² terus, yang lebih aneh meskipun saya hapus file script.js Ajax nya masih jalan bjirrrr😂😂😂
salam. saya mau bertanya. jadi saya menggunakan modal untuk mengedit data yang ditampilkan di tabel. setelah live search dijalankan, tombol submit di dalam form tidak bisa berfungsi. kenapa ya? mohon bantuannya
pak di google chrome saya ga muncul, klo di mozila muncul loadernya?
bpk jquerynya mana bpk :V
Laiya blm dibuat ternyata
Bkin playlist Jquery dong pak🙏🙏
saya memakai versi jquery-3.7.1.min.js tidak bisa
Pa, ko saya undefined index : keyword ya ?
sama nih
Notice: Undefined index: keywords in G:\Program Files\xampp\htdocs\phpdasar\pertemuan20jquery\ajax\mahasiswa.php on line 4
Saya khusus belajar seri jquery untuk belajar satu video ini....Ternyata penjelasannya dah lengkap. Seharusnya dengerin dulu sampe habis. wkwkwk..
Mantap pak, makasih banyak