Konuyu Oyla:
  • Derecelendirme: 0/5 - 0 oy
  • 1
  • 2
  • 3
  • 4
  • 5
Hızlı Arama PHP+JQuery-ajax
#1
Merhaba arkadaşlar istek üzerine basit bir uygulama hazırladım bir arkadaş facebook’da üst kısımdaki şekilde arama sormuş yani örnek veriyorum savaş ‘ı arıyacağız sa diyoruz altta hemen gösteriyor bizde sizlerle bunu yapıcağız. fazla zor bir işlem değil jQuery keyup() metodu işimizi görücektir. şimdi uygulamayı paylaşayım.


HTML + jQuery Kısmımız :



<!doctype html>
<html>
<head>
<*** charset="utf-8">
<title>Hızlı Arama</title>
<link href="css/style.css" rel="stylesheet" type="text/css">
<script type="text/************" src="REKLAM OLMASIN !"></script>

</head>

<body>

<div id="genel">

<input type="text" class="input" x-webkit-speech />
<div id="sonuclar"><ul></ul></div>

</div>

<script type="text/************">

$("#sonuclar").hide();

$(".input").keyup(function(){

var value = $(this).val();
var deger = "value="+value;

$.ajax({

type: "POST",
url: "post.php",

data: deger,
success: function(cevap){
if(cevap == "yok"){
$("#sonuclar").show().html("");
$("#sonuclar").html("Hiç bir sonuç bulunamadı!!");
}else if(cevap == "bos"){
$("#sonuclar").hide();
}else {

$("#sonuclar").show();
$("#sonuclar").html(cevap);

}
}

})

});

</script>
</body>
</html>
HTML Kısmını anlatmıyorum artık anlamışsınızdır arkadaşlar jQuery kısmını açıklayayım.. sonuclar divimizi ilk olarak hide() metodu ile gizliyoruz ardından input ‘a tuş basıldığı zaman sorgu yapmak için keyup() metodunu kullanıyoruz. ve $.ajax metodu ile sorgu yaptırıyoruz ( bu kısmı detaylı anlatmıyorum $_ajax konularında anlatacağım )

CSS Kısmımız :



body{

background-color:#f0f0f0;
}
#genel{

margin:0 auto;
width:960px;

}
.input{

width:500px;
height:25px;
border:3px solid #ccc;
font : 12px Tahoma;
text-align:center;

}

#sonuclar{
width: 490px;
padding: 7px;
background: #fff;
border: 1px solid #eee;
font: 12px Tahoma;
list-style:none;
}
#sonuclar li{
border-bottom: 1px solid #eee;
padding: 5px;
margin-bottom: 5px;
list-style:none;
}

#sonuclar li:hover{
background-color:#C90;

color:white;

}
Anlatmaya gerek duymuyorum basit zaten renklendir altını çiz gibi şeyler.



PHP Kısmımız :

baglanti.php


<?php

$dsn = 'mysql:host=localhost;dbname=ornek';
$user = 'root';
$password = '';

try {
$db = new PDO($dsn, $user, $password);
} catch (PDOException $e) {
echo 'Connection failed: ' . $e->getMessage();
}
$db -> exec("SET CHARACTER SET utf8");

?>
Klasik mysql_ in devri geçtiği PDO şeklinde yapıyorum arkadaşlar örnekleri. yukarıda klasik şekilde veritabanına bağlandık ardından karakter setini utf8 yaptık.

post.php



<?php

include "baglanti.php";

if($_POST){

$x=$_POST['value'];

foreach($db->query("SELECT * FROM yazi where baslik like '%".$x."%'") as $row) {
$baslik=$row['baslik'];
echo "<li>".$baslik."</li>";
}

}else{
header("Location: index.php");
}

?>
yukarıda ise $_POST işlemi olduğunda gelen value değerini x değişkenine aktarıyorum ardından foreach() döngüsü ile sql deki verileri çekiyorum burdaki sql sorgum


1
SELECT * FROM yazi where baslik like %$x%
yani yazılar tablosundaki baslik() kısmından $x ’değişkeni ( 1. sayfadan gelen veri yani ) ne benziyeni like metodu ile alıyorum bildiğiniz gibi like metodu where gibi %100 sonuç istemez yani savaş için sava sav gibi şeyler deseniz bile sonuç vericektir.
Beğenenler:
#2
Kelimeler Sansürleniyor ***** ;)
Beğenenler:

Konu ile Alakalı Benzer Konular
Konular Yazar Yorumlar Okunma Son Yorum
  Brute Force Arama Dorkları İçin En Çok Kullanılan Kelimeler !!! ( İngilizce ) TurKLoJeN 85 4,295 03-12-2016, Saat: 16:19
Son Yorum: ImRyMaTem
  Arama Motoru Listesi Stallk3r 45 1,510 08-11-2016, Saat: 22:18
Son Yorum: by_Kekosavar
  2000 Adet Wordpress Arama Dorklari archavin 6 3,194 04-01-2015, Saat: 01:37
Son Yorum: S1L3NC3R
  Google SQL Injection Arama Dork Bankasi 1500+ archavin 4 6,876 21-01-2014, Saat: 00:57
Son Yorum: d4rk
Anahtar Kelimeler

Hızlı Arama PHP+JQuery-ajax indir, Hızlı Arama PHP+JQuery-ajax Videosu, Hızlı Arama PHP+JQuery-ajax Online izle, Hızlı Arama PHP+JQuery-ajax Bedava indir, Hızlı Arama PHP+JQuery-ajax Yükle, Hızlı Arama PHP+JQuery-ajax Hakkında, Hızlı Arama PHP+JQuery-ajax Nedir, Hızlı Arama PHP+JQuery-ajax Free indir, Hızlı Arama PHP+JQuery-ajax Oyunu, Hızlı Arama PHP+JQuery-ajax Download


1 Ziyaretçi