Sıralamadan kastım, kategori sıralama olabilir, eklenti sıralama olabilir, yazı sıralama olabilir vb.. Normalde sıralama işlemlerini yapabilmek için epeyce kod yazmaktan ziyade kullanıcının nasıl en rahat şekilde kullanabileceğinin hesabını kitabını sıklıkla yapıyoruz. Sağolsun jQuery‘ nin Ui (kullanıcı arayüzü (user interface)) imdadımıza yetişiyor. Önce sıralama (sortable) fonksiyonunu kullanıyoruz, daha sonra veriyi serileştiriyoruz (serialize) sonrada ajax ile postalıyoruz.Hemen kodlarımıza bakalım. Öncelikle bu iki dosyayı Jquery Ui indirelim ve sayfamıza ekleyelim.Veritabanımızdaki kategoriler tablomuz.
CREATE TABLE [kategoriler] ( [id] int IDENTITY(1, 1) NOT NULL, [kategoriadi] nvarchar(50) NULL, [sira] int NULL, PRIMARY KEY CLUSTERED ([id]) ) ON [PRIMARY] GO
sirala.aspx sayfamızın içeriği
<script type="text/javascript" src="jquery-1.3.2.min.js"></script> <script type="text/javascript" src="jquery-ui-1.7.1.custom.min.js"></script>
body {
font-family: Arial, Helvetica, sans-serif;
font-size: 16px;
margin-top: 10px;
}
#icerik ul{
margin:0;width:300px
}
#icerik ul li {
list-style: none;
margin: 0 0 4px 0;
padding: 5px;
background-color:#007dd5;
color:#fff;
}
#icerik li:hover{
cursor:move;
}
.yeniyer{border:2px dotted #860101}
<script type="text/javascript">
$(document).ready(function(){
$(function() {
$("#icerik ul").sortable({
placeholder: 'yeniyer',
opacity: 0.6,
cursor: 'move',
update: function() {
var order = $(this).sortable("serialize");
$.post("kaydet.aspx", order);
}
});
});
});
</script>
<div id="icerik">
<ul>
<asp:Literal runat="server" ID="liste"></asp:Literal>
</ul>
</div>
Sirala.aspx.cs sayfamızın içeriği
protected void Page_Load(object sender, EventArgs e)
{
if(!IsPostBack)
{
listeDoldur();
}
}
protected void listeDoldur() {
DataTable dt = veritabani.DataTableGetir("select * from kategoriler order by sira asc");
foreach (DataRow dr in dt.Rows)
{
liste.Text += "
<li id="\"sira_"">" + dr["kategoriadi"].ToString() + "</li>
";
}
}
kaydet.aspx.cs sayfamızın içeriği, yani sıralama işlemlerini veritabanına yazan sayfamız.
protected void Page_Load(object sender, EventArgs e)
{
string gelen = Request.Form.ToString().Replace("%5b%5d", "[]").Replace("sira[]=", "");
char[] ayrac = new char[] { '&' };
string[] gelenler = gelen.Split(ayrac);
int i = 1;
foreach (string veri in gelenler)
{
veritabani.guncelle("Update kategoriler set sira='" + i + "' where id=" + veri + " ");
i++;
}
}
Örneğin tamamını indirmek için tıklayın. Çalışan örneğe buradan bakabilirsiniz.
Eline sağlık, her zamanki gibi yine çok faydalı bir makale…
teşekkürler ama
dosya indirilmior.
merhaba ben bu uygulamayı asp ye çeviremedim aspx ide çalıştıramadım bunun asp si direkt asp kodları yokmu nasıl otomatik kaydediyor. bana yardımcı olur musunuz rica etsem.
merhaba
bu güzel uygulama bize çok acil lazım ve bu çok iyi. fakat biz asp kullanıyoruz aspx i kullanamadık siteye entegre edemedik bunu nasıl asp ye dönüştürürüz bilen bir arkadaşımız yardımcı olursa çok seviniriz. her kullanıcı kendi sayfasındaki sıralama ayrı ayrı kaydedebiliyor mu bu yoksa herkesin yaptığını bir mdb de mi topluyor?
@emre dosyanın adresini düzelttim, şimdi indirebilirsiniz.
@alican zaman sıkıntısı sebebiyle uygulamanın asp ile nasıl yapılacağını yazmam çok zor. Ama ilgili dosyaları indirip mantığını rahatlıkla anlayıp kendiniz yazabilirsiniz.
apoStyLEE , buna benzer asp ile yazılmış bir script biliyor musun? yani her kullanıcı kendi ayarlarını görebilecek örneğin ben a üyesiyim ve sayfadaki bazı nesnelerin yerlerini değiştirdim veritabanına bu kaydedildi . b üyesi ise nesneleri farklı konumlara yerleştirdi onun ayarları ise ayrı kaydedildi. bu şekilde geliştirilmiş bir script biliyorsan söylersen sevinirim =)
teşekkürler
@alican, böyle bir uygulama bilmiyorum ama eğer asp bilgin varsa rahatlıkla kendin yapabilirsin. Bir veritabanında bir tablon olsun, bu tabloda ilgili kullanıcının ayarları saklı kalsın. Her değişiklikte bu alanları güncellersen istediğin çok güzel bir şekilde olur. Tabi biraz uğraşman gerekir ;)
mükemmel birşey bu ya
bunu master detail halinde nasıl yapabiliriz acaba. sürükle bırakla bir anamenunun altından baska bir anamenunun altına atmak orada sıralama yapmak gibi teşekkürler
Merhaba, istediğinizi yapmak esasında çok basit. Ana hatlarıyla yukarda zaten konuyu anlatmaya çalıştım. Sizin yapmanız gereken istediğiniz menü yapısını bir veritabanı içinde modellemek ve yukarıdaki mantıkta kodlarınızı yazmak.
Selam uygulama anlatımı için teşekkürler , indirme linkinde bir sıkıntı var düzeltebilirsen sevinirim.
Teşekkür ederim, indirme adresini düzenledim.