1. Ana Sayfa
  2. ASP.Net
  3. MVC Client Side Validation Nedir? Bölüm-38

MVC Client Side Validation Nedir? Bölüm-38

060919_1216_MVCRoutingl9.png

Bu yazımda sizlerle kavramının ne olduğunu ve nasıl kullanıldığını inceleyeceğiz.

Client Side ?

MVC uygulamasında model yapısında Javascript kütüphanesi yükleyerek tarayıcı tabanlı yapılan validasyon işlemlerine denir.

Resim-1

Visual Studio geliştirme ortamını açalım, File>New>Project yolunu izleyerek MVC projemizi oluşturmaya başlayalım.

Resim-2

Templates>Visual C#>Web şablonlarından ASP.NET Web Application seçeneğini seçelim, projemize Name kısmından isim verelim. OK tuşuna tıklayarak devam edelim.

Resim-3

Empty şablonunu seçtikten sonra MVC seçeneğini de seçelim ve OK tuşuna tıklayıp projemizi oluşturalım.

Resim-4

Tools>Nuget Package Manager>Manage Nuget Package For Solution seçeneğini tıklayalım ve ve Unobtrusive kütüphanesini yükleme işlemlerine başlayalım.

Resim-5

Jquery Validation ve Unobtrusive Validation kütüphanesini projemize yükleyelim.

Resim-6

Jquery Validation yükledikten sonra MVC sürümümüze uygun olan kütüphaneyi de projemize ekleyelim.

Resim-7

Controller dosyamıza bir isim verelim ve Add seçeneği ile ekleme işlemini gerçekleştirelim.

Resim-8

Views klasörüne sağ tıklayalım Add>View seçeneğini seçelim.

Resim-9

View adımızı _Layout olarak verelim ve sayfalarımız için bir adet Master Page oluşturalım.

Resim-10

ActionResult metodumuza sağ tıklayalım Add View seçeneği ile projemize View ekleyelim.

Resim-11

Index adı metot adı ile aynı olarak gelmektedir. Add seçeneğine tıklayalım ve Layout dosyamızın yolunu belirterek View ekleme işlemini gerçekleştirelim.

Resim-12

Models klasörüne sağ tıklayalım Add>Class seçeneğini seçelim.

Resim-13

Class dosyamıza isim verip Add seçeneği ile ekleme işlemini gerçekleştirelim.

Resim-14

Class dosyamızda değişkenlerimizi atayalım ve sınıfımızı değişken olarak tanıtalım.

Resim-15

Class dosyamızı da Models klasörümüzün altına ekleyelim.

Resim-16

Models klasörümüzü validasyon işlemlerini yapacağımız Class dosyamızı da ekleyelim ve kurallarımızı belirtelim.

Resim-17

Model olarak kullanacağımız Class içerisine validasyon Attribute tanıtımını yapalım.

Resim-18

Layout dosyamızı düzenleyelim ve Jquery ile Css dosyalarımızı ekleyelim.

Resim-19

Validasyon işlemi için kullanacağımız sayfa içerisinde Model sınıfımızdan gelen verileri aktaralım ve Model sınıfımızı tanıtalım. Validasyon işlemleri için Html Helper ile Enable işlemlerini gerçekleştirelim.

Resim-20

Controller dosyamızda validasyon işlemini kontrol ederek eğer validasyon sağlanmamış ise sayfaya yeni bir model tanımlayarak gönderelim.

Resim-21

Global.asax dosyamız içerisinde yazmış olduğumuz validasyon sınıfımızı sistemimize tanıtalım ve projemizi çalıştıralım.

Resim-22

Formumuza validasyonlarımızı çalıştıracak şekilde verilerimizi yazalım tarayıcı tabanlı Validate işlemi yaptığımız için uyarılar karşımıza hemen çıkmaktadır.

Resim-23

Client Side Validasyon işlemlerimizi çalıştırmış olduk.

Bir sonra ki yazıda görüşmek dileğiyle.

Bu konuyla ilgili sorularınızı http://forum.mshowto.org linkini kullanarak ulaşacağınız forum sayfamızda sorabilirsiniz.

Referanslar

www.mshowto.org

TAGs: mvc, mvc nedir,,,mvc html,, validation,,data anotations,mvc annotations,context,mvc context,mvc validation,validation message,validation nedir,,model state nedir,,jquery,mvc jquery,jquery validation,client validation nedir,client side validation

Yorum Yap

Yazar Hakkında

Servan Oral, 1991 yılında Diyarbakır’da doğdu. Üniversite öncesi öğrenimini Malatya’da tamamladı. Dicle Üniversitesi ve Atatürk Üniversitesi Bilgisayar Programcılığı mezunudur. .Net Developer olarak birçok firmada görev almıştır. MSHOWTO bünyesinde yazar olarak görev yapmaktadır. Uzmanlık alanları olan; Bilişim Güvenliği, Microsoft Azure, Microsoft Visual Studio, C# .Net, Asp.Net, Cloud Computing, Microsoft Azure SQL, Microsoft SQL Server, MVC .Net alanlarında yazarlık yapmakta ve etkinliklerde uzmanlık alanlarında konuşmacı olarak görev almaktadır. MCP sertifikası bulunmaktadır.

Yorum Yap