Asp.Net Mvc'de Form Yapma

Bu makalemizde MVC 3.0 ile yazılmış basit bir veri giriş uygulaması oluşturacağız. Öncelikle yapacağımız uygulamanın senaryosunu oluşturalım.
Uygulamamız bir bankanın kredi kartı için yaptığı reklam ile kredi kartı başvuru formunu kapsasın.

*Öncelikle bir ana sayfa oluşturalım ve kullanıcılara kredi kartı isteyip istemediklerini soralım.
*Sonra kullanıcıları bir link ile kredi kartı başvuru formuna yönlendirelim.
*Son olarak kayıtlarının alındığına dair bir sonuç sayfası oluşturalım.

Visual studio programını açıp yeni proje oluşturuyoruz. MVC tipleri arsından Empty seçilir. Daha sonra Sayfa adında controller ekliyoruz. Sonra Teklif adında bir ActionResult metodu ekliyoruz. Daha sonra bu oluşturduğumuz teklif adındaki ActionResult metodumuza Masterpage kısımını işaretlemden ve Razor kısmını seçtiğimizden emin olarak bir view ekliyoruz. Daha sonra oluşturduğumuz teklif view'ına girip şekil-1 deki gibi html etiketlerini ekliyoruz @html.actionlink(başka bir view'a link vermek için kullanılır. @html.actionlink (başka bir view'a link vermek için kullanılır)'in içeriğin birincisi metin diğeri ise view'ın ismi gelmek zorundadır.

Şekil –1


Daha sonra ise global asax'ı projemizin controller ve action'ımıza göre düzenleyip projemizi çalıştırıyoruz. Ve ekran çıktısı şekil -2 deki gibi olmalıdır.

Şekil –2


Modelse sağ tıklayıp şekil-3 teki gibi KartBilgi adında bir sınıf ekliyoruz ki bu sınıf oluşturacağımız formdan alacağımız elemanları tanımlayacağımız sınıftır.

Şekil –3


Sonra oluşturduğumuz KartBilgi adındaki sınıfa girip formda bulunması istediğimiz elemanları şekil -4 teki gibi yazıyoruz.

Şekil –4


Şimdi ise formumuzu oluşturacağımız aşamaya geldik. Öncelikle BasvuruFormu Adında bir Viewresult metodu ekliyoruz. Daha sonra ise bu metodumuza stronghly typed view ve use master page kısmına şekil-5 deki gibi olacak şekilde BasvuruFormu adında bir view ekliyoruz.

Şekil –5


Formumuzda ad, soyad, mail, telefon kısımları textbox olarak cinisiyeti radiobutton ve tercih kısmını ise dropdownlist olarak düzenleyelim. Formumuzdaki ad soyad gibi form elemanlarının tanımlanırken id kısmına yazdığımız isimleri KartBilgi sınıfında tanımladığımız property ler ile aynı isimde olmalıdır.(şekil-6)

Şekil –6


Sonraki aşamada ise projemizi çalıştırmayı deneyelim ekrana gelen sayfada Başvuru formu metinine tıkladığımızda gelen sayfa şekil-7 ‘deki gibi olmak zorundadır.

Şekil –7


Sonucu gönder butonuna tıkladığımız da sayfa da herhangi bir değişiklik olmayacaktır. Bunun sebebi ise daha gönderilecek acitonda gerekli olan değişiklikleri yapmadığımızdan kaynaklanmaktadır. Şimdi ise Sonuc adında bir view ekliyoruz ve buView'ın içine şekil-8'deki gibi gerekli olan Html etiketlerini yazıyoruz.

Şekil –8


Daha sonra sayfacontroller kısmına geliyoruz ve şekil-9' daki gibi HttpGet ve HttpPost kısmını ekliyoruz. HttpGet Sayfayı çağırdığınız anda tetiklenmesini sağlayan attribute'tür. HttpPost ise Sayfayı post ettiğimizde tetiklenmesini sağlayan attribute'tür.

Şekil –9


Son olarak ise projemizi çalıştırıyoruz. Ekran çıktısı şekil-10'daki gibi olmak zorundadır.Ve böylecelikle bir veri giriş formunun ilk kısmını burada tamamlamış olduk. İkinci kısımda giriş denetilmelerini yapacağız.

Şekil –10


Makalemizle ilgili soru ve önerileriniz için yorum yazmayı unutmayınız.

iyi çalışmalar dileriz.

Kod indir : Asp.Net Mvc'de Form Yapma
Konuyla İlgili Diğer Makalemizi Okumak İçin Tıklayınız.

Makaleye Yardımlarından Dolayı İbrahim Uğur YILMAZ'a ve Salih Bayka 'ya Teşekkür Ediyorum.

Yorum Yaz

Yorumlarınız denetimden geçtikten sonra yayınlanmaktadır...