PHP:jQuery Sortable Sürükle – Sırala

jQuery Sortable

Bu kez, jQuery UI kullanarak Data sıralama uygulaması yapıyoruz.  jQuery UI Dragable ve Sortable metodları ile sürüklenerek sıralanabilir basit bir uygulamanın kodlarını paylaşıyorum.

Ajax ile sıralamanın etkilerini database verilerini güncellemek mümkün.

Geçelim Kodlara; 

index.php


<div id="infom"></div>
<ul id="test-list">
<?php
$s=$db->q("SELECT * FROM il ORDER BY ordernum DESC, id ASC LIMIT 0,10");
while($row=$db->fassoc($s)){
?>
<li id="listItem_<?=$row&#91;'id'&#93;?>"><img src="arrow.png" alt="move" width="12" height="12" class="handle" /> <?=$row&#91;'il_adi'&#93;?> </li>
<?php
}
?>
</ul>

Sayfaya entegre edilecek JS dosyalarını da ekleyelim;


<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="sortable.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#test-list").sortable({
handle : '.handle',
update : function () {
var order = $('#test-list').sortable('serialize');
$(".infom").load("islem.php?"+order);
}
});
});
</script>

jQuery UI kütüphanesini içinde barındıran sortable.js dosyasını buradan inceleyebilirsiniz.

 

islem.php

Sıralama işlemlerinin yapıldığı (DB bağlantılı)  islem.php kodlarına geçelim;


<h2>Ajax Request</h2>

<?php
foreach ($_GET&#91;'listItem'&#93; as $position => $item) :
echo $aaa= "UPDATE `product` SET `ordernum` = $position WHERE `id` = '$item'  ";
endforeach;

?>
<div class="valid_box">Data sıralaması başarıyla güncellendi.</div>

demo uygulama

Uygulama dosyasını İndir

 

 


Kodları incelediğinizde anlaşılacağı gibi yine yeni yeniden Serpito’dan  alabileceğiniz veritabanı sınıfını kullandım. Uygulamanın çalışır demosunu DEMO resimine tıklayarak inceleyebilirsiniz.

7 thoughts on “PHP:jQuery Sortable Sürükle – Sırala

  • hocam merhaba,ben herşeyi yaptım sortable çalışıyor ama veriler update edilmiyor,veritabanına sorgulara göre kayıtları ekledim bi yardımcı olurmusunuz?

  • Serpito hocam eline saglık fakat update te sadece gormeniz için demo yazılar var buraya islem.php kodunu ekliyorum isteyen kullansın update edilme olayı bu sekilde.

    kendi db.php ini yazdıktan sonra

    $item) {
    echo $aaa = mysql_query("UPDATE `product` SET `ordernum` = '$position' WHERE `id` = '$item'");
    }
    ?>

    query yaptırıp sorguyu kaydedebiliriz. Tesekkurler.

  • Ustam Veritabanı update yapmıyor bir çok yolu denedim ama yemedi bir yerde problem var.

  • Yazı için teşekkürler çok faydalı bir konu lakin bunu tablada uygulayabilirmiyiz ?

  • Paylaşım için teşekkürler çok yardımcı oldu bunun tablo ile yapımı için bilgi verebilirmisiniz

  • Bu örneğinizi admin panelinde sıkıntısız kullanıyorum ancak “You have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near ” at line 1″ Sıkıntısı alıyorum bi sitede , kayıt sayısı çok fazlaydı bundan dolayı olduğunu tespit ettim yardım edebilirmisiniz

  • Merhaba her işlem tamam fakat update işlemini yapamıyorum. Düzenlemeyi yaptikdan sonra kayıt içine ne yapmalıyım Sürükle birak işlemi oluyor fakat herhangibir işlem yapmiyor.

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir