Php ile Yukarı/Aşağı Butonunu Kullanarak Sıralama Yapma


Sitede yer alan modüllerde ya da listeleme sırasında oluşan sıralamalarda, kimi zaten tekrardan sıralama yapma gereği duyarız. Çoğunlukla da bu işlemi, sıra değerlerini elle girerek değiştiririz. Php kullanılan bir yapıda böylesine bir kullanımda bulunmak büyük hatadır. Bundan rahatsız olduğumdan dolayı, Yukarı ve Aşağı butonlarının bulunduğu, tekrardan sıralanabilir bir listelemenin nasıl yapılacağını göstermek istedim.

Aslında bu işlemi jQuery ile gerçekleştirmek en mantıklısı olacaktır. Fakat bunu sadece php üzerinden yapmak isteyenlere de en sadece ve biçimsel hali bu olacaktır.

Uygulamayı geliştirmek için öncelikle bir veri tabanı oluşturuyoruz. Türkçe karakter sorunu olmaması için, Karşılaştırma türünü utf8_general_ci olarak ayarlıyoruz. Sonrasında aşağıda yer alan kodları SQL bölümüne yazıp Git diyoruz.

CREATE TABLE `makale` (
`id` int(11) unsigned NOT NULL AUTO_INCREMENT,
`sira` int(11) unsigned NOT NULL,
`baslik` text,
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8;

LOCK TABLES `makale` WRITE;

INSERT INTO `makale` (`id`, `sira`, `baslik`) VALUES
(1, 1, 'Php ile Excel Dosyasından Veri Çekmek ve Kayıt Etme'),
(2, 2, 'Php ile Seçili 2 Tarih Arasındaki Verileri Listeleme'),
(3, 3, 'Heredoc ile Tırnak Problemlerine Çözüm Buluyoruz'),
(4, 4, 'Ücretsiz Turuncu Blog Teması | Eski Site Tasarımı'),
(5, 5, 'PDO ile Site İçi Arama İşlemi | PDO Like');
UNLOCK TABLES;

Veri tabanını oluşturduktan sonra uygulamayı gerçekleştireceğimiz html alanını tasarlayalım. Yapacağımız örnekte çok fazla kod satırı olduğundan dolayı, gerekli örnek dosyasını indirebilirsiniz.

Örnekte yer alan kodlara bakacak olursanız, listeleme alanları <li> tagları arasındadır. Bu alana gelecek olan verileri, veri tabanından foreach döngüsüyle alalım. Tabi bundan önce bir MySQL bağlantısı gerçekleştirmeniz gerekmektedir. Bunun için, adlı makaleye göz gezdirebilirsiniz.

<div id="Liste">
<ul>
<?php $Listele = $db->query("SELECT * FROM makale ORDER BY sira ASC")->fetchAll(PDO::FETCH_ASSOC); ?>
<?php foreach($Listele as $VeriAl){ ?>
<li>
<span class="sira"><?=$VeriAl["sira"]?> -</span>
<span class="baslik"><?=$VeriAl["baslik"]?></span>
<span class="islem">
<a href="#" class="yukari"><img src="yukari.png" alt="" /></a>
<a href="#" class="asagi"><img src="asagi.png" alt="" /></a>
</span>
</li>
<?php } ?>
</ul>
</div>

Listeleme alanını dinamik bir hale getirdik. Şimdi de Yukarı ve Aşağı butonlarını düzenlememiz gerekiyor. Burada yapacağımız 2 düzenleme bulunmaktadır. İlki işlemin yapılmasını sağlayacağımız URL düzenlemesidir. Diğeri ise bir koşul düzenlemesidir. Bu koşul, 1. Sıradaysa daha fazla aşağı inmemesini sağlayacak, son sıradaysa da daha aşağı inmemesini sağlayacak olan ifadedir.

İlk olarak en üst ve en alt sayı değerini alıp, eşit değilse işlemine tabi tutarak, butonların ilk ve son satırda görünmemesini sağlıyoruz. Sonrasındaysa URL yapısını oluşturarak, işlem türünü, id değerini ve sıra değerini belirtiyoruz. Böylelikle GET ile yapacağımız işlemlerin URL tarafından yollanmasını sağlamış olacağız.

<?php if($VeriAl["sira"] != "1"){?><a href=" index.php?islem=yukari&id=<?=$VeriAl["id"]?>&sira=<?=$VeriAl["sira"]?>" class="yukari"><img src="yukari.png" /></a><?php } ?>
<?php if($VeriAl["sira"] != Count($Listele)){?><a href=" index.php?islem=asagi&id=<?=$VeriAl["id"]?>&sira=<?=$VeriAl["sira"]?>" class="asagi"><img src="asagi.png" /></a><?php } ?>

Bu düzenlemeyi yaptıktan sonra GET parametresiyle gelen verileri alıp, gerekli sıralama işlemini yapalım.

İlk olarak GET işlemlerini yapacağımız kod alanını belirtiyoruz. Tabi bunu switch yapısı ile yapsak daha mantıklı olurdu ama koşul ifadeleriyle de yapılacağını unutmayalım.

if(@$_GET["islem"] != ""){
// Sıralama ile ilgili işlemler burada yapılacak.
}

Öncelikle sırasını değiştireceğimiz verinin sırasını "0" yapalım. Böylelikle hem sıralamadan çıkartmış oluyoruz hem de düzenleme yapabilmek için farklı bir değer atamış oluyoruz.

$db->query("UPDATE makale SET sira='0' WHERE id='".$_GET["id"]."'"); // Gelen Değerin Sırasını 0 Yaptık

Yeni sıra değerini yazdırdıktan sonra Aşağı ya da Yukarı durumuna göre, sıra değerini arttırma ya da azaltma işlemini yapacağız. Bunun için çok basit bir koşul ifadesi yazacağız.

if($_GET["islem"] == "asagi"){
$YeniSira = $_GET["sira"] + 1;
}elseif($_GET["islem"] == "yukari"){
$YeniSira = $_GET["sira"] - 1;
}

Bu koşulla, Sıralama değeri aşağı indirilmek istenen değere +1, sıra değeri yukarı çıkartılmak istenen değere -1 uygulaması yapıyoruz. Buradan gelen yeni sıralama değeriyle de güncelleme işlemini gerçekleştiriyoruz.

## İşlem yapılacak olan sıranın altındaki ya da üstündeki (aşağı yukarı işlemine göre gelen değer) değere yeni sıra bilgisini giriyoruz.
$db->query("UPDATE makale SET sira='".$_GET["sira"]."' WHERE sira='".$YeniSira."'");
## Sırasını değiştireceğimiz olan verinin sırasını değiştiriyoruz.
$db->query("UPDATE makale SET sira='".$YeniSira."' WHERE sira='0'");

Böylelikle sıralama işlemini bitirmiş oluyoruz. Kafası karışan ya da toparlayamayanlar aşağıdaki bitmiş haline bakabilirler.

GET işlemlerinin yapıldığı kod bloğunun son hali şöyle olacak;

if(@$_GET["islem"] != ""){
$db->query("UPDATE makale SET sira=0 WHERE id='".$_GET["id"]."'");
if($_GET["islem"] == "asagi"){ $YeniSira = $_GET["sira"] + 1; }elseif($_GET["islem"] == "yukari"){ $YeniSira = $_GET["sira"] - 1; }
$db->query("UPDATE makale SET sira='".$_GET["sira"]."' WHERE sira='".$YeniSira."'");
$db->query("UPDATE makale SET sira='".$YeniSira."' WHERE sira='0'");
}

Basit bir mantıkla Aşağı ve Yukarı butonlarıyla, yönetilebilir bir sıralama gerçekleştirdik. Böyle bir işlem yapacaksanız ve görsel olarak daha işler çıkartmak istiyorsanız en mantıklısı jQuery UI ile yapılacak sıralama olacaktır.
- 07.08.2015 / 17:38:03 15

Sosyal Medya Paylaşım Alanı

Makale Destekli Kütüphane Verileri

Bunlarda İlginizi Çekebilir

Genel Makaleler

Xampp Apache Port 80 Sorunu ve Çözüm Yolları

Kategori: Genel Makaleler | 10.09.2014
17:59 Php Dersleri
Windows

Windows 32 bit ile 64 Bit Arasındaki Fark Nedir?

Kategori: Windows | 03.05.2013
Windows
Web Tasarımları

Gri WordPress Teması | Eski Site Teması

Kategori: Web Tasarımları | 30.08.2014

Hadi Sende Yorum Yap!

Yorum Gönderilmiştir. Onaylandıktan Sonra Mesajınız Yayınlanacaktır.