Css | Alper Konuralp'in Blog Sitesi

Asp.Net MVC Veri Aktarım Elemanı

Şubat 26th, 2012 |

Author: alper

Merhaba, MVC ile site geliştiriyorsanız benim karşılaştığım durum ile sizde karşılaşabilirsiniz. Burada olay şöyle gelişiyor:

1. Kişi yeni veri giriş ekranında bir veri giriyor.
2. sistem verinin doğruluğundan emin olduktan sonra veriyi veri tabanına kaydediyor.
3. sonrada işlem listeleme sayfasına devrediliyor.

bu işleme kod olarak baktığımızda :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

public class Ornek : Controller
{
public ActionResult Index()
{
var veriler = VeriKaynagi.VerileriAl();
return View(veriler);
}
public ActionResult Yeni()
{
return View(new Veri());
}

[HttpPost]
public ActionResult Ekle(Veri veri)
{
if (!ModelState.IsValid)
{
return View("Yeni", veri);
}
// veriyi veri tabanına kaydeden kodlar

return RedirectToAction("Index");
}
}

Şimdi yapmamız gereken veri doğru olarak kaydedildiğine dair bir bilgiyi sayfaya göndermek istiyorum. Ama bunuda yapıyı bozmadan yapmam lazım. O zaman ilk aklıma ViewBag kullanmak geldi ve kodu şöyle düzelttim :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

Çok zekice gelmişti bana ama maalesef kod çalışmadı. Daha doğrusu çalıştı ama ViewBag.EkMesaj her durumda boş geldi. Böyle olunca da Böyle Gitmez Söz Google’da dedim ve bir arama yaptım. Bu tür konularda çoğunlukla karşıma çıkan Stack Overflow‘da aradığım cevabı buldum.
Burada ViewBag’in doğru nokta olmadığı ve bunun yerine TempData elemanının kullanılması gerektiği yazıyordu. Böylece özellikle Redirect işlemlerinde ilk sayfa ikinci sayfaya bir data aktarabiliyordu. İlgili link bu.

O zaman çözüm şöyle olacak:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

public class Ornek : Controller
{
public ActionResult Index()
{
var veriler = VeriKaynagi.VerileriAl();
return View(veriler);
}
public ActionResult Yeni()
{
return View(new Veri());
}

[[HttpPost]]
public ActionResult Ekle(Veri veri)
{
if (!ModelState.IsValid)
{
return View("Yeni", veri);
}
// veriyi veri tabanına kaydeden kodlar
TempData.Add("EkMesaj", "Veriler Başarıyla Kaydedilmiştir.");
return RedirectToAction("Index");
}
}

İyide ön tarafı nasıl yazarız derseniz… ben biraz atraksiyonlu yazdım. Adım adım bakalım. Önce mesajın gözükeceği yeri ayarlamamız lazım. genel geçer bir durum olsun diye ben bu elemanı master layout içine aldım. <body> tagından önceye şöyle bir kod ekledim:

1 2	@if (TempData.ContainsKey("EkMesaj")) {<div id="dEkMesaj">@TempData["EkMesaj"]</div>}

böylece mesaj geldiğinde böyle gözükecek. Bu elemanın görüntü özellikleri için css’e aşağıdakini ekledim:

1
2
3
4
5
6
7
8
9
10
11
12
13
14

#dEkMesaj
{
display: none;
position: fixed;
top: 0;
left: 50%;
margin: 0 0 0 -100px;
width: 200px;
background: yellow;
color: black;
border: 1px solid darkorange;
border-top: 0;
text-align: center;
}

iyi gidiyoruz ama daha bitmedi. Birde olayın atraksiyon tarafını halleden sevgili javascript kodumuz var. Doğal olarak jquery kullanıyoruz:

1
2
3
4
5
6
7
8
9

$(function () {
if ($('#dEkMesaj').length > 0) {
$('#dEkMesaj')
.css({"opacity": 0, "display":"block"}) // görünmez elemanı önce görünür ama görünmez yapıyoruz :D
.animate({ opacity: 1 }, 500) // sonrada yarım saniyede görünür hale geliyor.
.delay(3000) // 3 saniye görüntüde kalıyor
.animate({ opacity: 0 }, 1000, function () { $('#dEkMesaj').hide(); }); // sonrada görüntüden 1 saniyede çıkıyor.
}
});

bu mudur? bence budur.
Kolay gele…

Posted in Asp.Net, Css, Html, JavaScript, JQuery, Microsoft MVC, Microsoft.Net |

No Comments »

Css ile neler yapılabilir

Mart 26th, 2011 |

Author: alper

Css ile ne yapılabilir, insanın kafasında hemen canlanmayan bir konu. Cevap olarakta çoğunlukla herşey şeklinde cevap vermek mümkündür. Ama bunun görsel halini karşıya anlatmak zordur. Bir web sitesi bunu yapmış. http://www.csszengarden.com/ adresinin html tarafına baktığınızda sabit bir sayfa görürsünüz. Inline css kullanılmamış temiz bir html dosyasıdır bu. Sonrada elinize css fırçasını alıp, sayfayı renklendirirsiniz. Yapılmış çalışmalar sayfada görüntülenmektedir. http://www.mezzoblue.com/zengarden/alldesigns/ adresinde bütün dizaynlar listelenmiş. Tekrar hatırlatmak isterim ki bu dizaynlar hep aynı html dosyasını kullanmaktadırlar.

Pts	Sal	Çar	Per	Cum	Cts	Paz
« Şub
	1	2	3	4	5	6
7	8	9	10	11	12	13
14	15	16	17	18	19	20
21	22	23	24	25	26	27
28	29	30	31

Alper Konuralp'in Blog Sitesi

Archive for the ‘Css’ Category

Asp.Net MVC Veri Aktarım Elemanı

Css ile neler yapılabilir