ASP.NET'e Giriş

  Microsoft’un geliştirdiği, .Net Framework üzerine çalışan web uygulama dilidir. Microsoft tarafından geliştirilen, .NET Framework kullanan hızlı kod geliştirme ortamıdır. .NET altında genellikle C# ve Visual Basic .NET kullanılmaktadır. Asp.net ile bir web uygulaması geliştirmek için Visual Studio kullanılır.

 ASP.NET Temel Özellikleri

      ASP.NET, .Net Framework altında işletim sistemi ile bütünleşik çalışan bir mimaridedir. ASP.NET sunucu ve istemci tarafını çok iyi bir şekilde birleştirir. ASP sunucu tarafında interpret edilen bir teknoloji iken ASP.NET derlenir. Derlenen kod çok büyük bir performans artışı sağladığından uygulamalar çok daha hızlı çalışacaktır.  Oturum yönetiminde ise sunucu belleği üzerinde yoğunlaşan bir oturum mimarisi yerini dağıtık internet uygulamalarına dönüşmüş, oturum bilgileri SQL Server’da da olmak üzere State Server gibi yeni sunucular kullanılarak sunucunun belleği üzerinden ayrılmıştır. Bu şekilde sunucular arası veri paylaşımı sağlanmış, güvenli ve dengeli bir yapıda sistem kurulmuş olmaktadır.

      ASP.NET’in özellikleri

     Asp.net code behind denilen tasarım öğeleri ile programlama öğelerini bir birinden ayrı sayfalarda bulunduran bir özelliği destekler. Bu özellik sayesinde bir proje üzerinde tasarımcı ve programcı aynı anda çalışabilir.

Sayfanın tasarım öğeleri (web forms için) .aspx uzantılı dosyada bulunurken program nesneleri .aspx.cs (Csharp için .cs, VB.net için .vb) uzantılı dosyalarda bulundurulur.

Asp.net’ te Web Forms veya MVC programlama modellerini kullanarak uygulamalar geliştirebilirsiniz.

Microsoft .Net platformunun tüm özellikleri Asp.net uygulamaları için geçerlidir.

Visual Studio içerisindeki web kontrolleri (buton, textbox, dropdown list vs..) sürükle-bırak özelliği kullanarak hızlı ve basitçe uygulamaya dahil edilebilir.

Modern web uygulama ara yüzleri oluşturabilmek için MasterPage ve Theme yapıları mevcuttur.

Asp.net’ te gelişmiş oturum yönetimi desteği mevcuttur. Bu sayede üyelik işlemleri basit ve güvenli olarak yapılabilir.

JAVASCRIPT FOR DÖNGÜSÜ 

Şart sağlandığı sürece komutların tekrar tekrar çalıştırılmasını sağlar. Başlangıç değeri, şart ifadesi ve artış miktarı belirtilmelidir.

Kullanım Şekli: 

for(değişken ismi=başlagıç değeri;şart;artış miktarı)

{

 Yapılacak işlemler;

}

Javascript Örnekleri : For döngüsü kullanarak ekrana 10 defa alt alta "merhaba" yazan javascript kodlarını yazınız.

<script>

for(var i=0;i<10;i++)

   {
      document.write("merhaba"+"<br>");
   } 

</script>

 Javascript Örnekleri : For döngüsü kullanarak 1 ile 10 arasındaki sayıları ekrana javascript kodlarını yazınız.

 <script>

for(var i=1;i<=10;i++)

{
      document.write(i+"<br>");
} 

</script>

Javascript Örnekleri : For döngüsü kullanarak 1 ile 100 arasındaki ÇİFT sayıları ekrana yazdıran javascript kodlarını yazınız.

1. yöntem:

<script>

for (var i = 0; i <= 100; i++)
   {
      if(i%2==0) 
      document.write(i+ "<br/>");
   }

</script>

2. Yöntem

<script> 

   for( var i=0;i<=100;i=i+2)

    {
      document.write(i+"<br>");   
    }

</script>

Javascript Örnekleri : For döngüsü kullanarak  1 ile 100 arasındaki TEK sayıları ekrana yazdıran javascript kodlarını yazınız.

1. yöntem:

<script>

for (var i = 0; i <= 100; i++)
      {
         if(i%2==1) 
         document.write(i+ "<br/>");
       }

</script> 

2. Yöntem

<script> 

for( var i=1;i<=100;i=i+2)
    {
       document.write(i+"<br>");   
     }

</script>

Javascript Örnekleri : For döngüsü kullanarak  1 ile 10 arasındaki sayıların toplamını ekrana yazdıran javascript kodlarını yazınız.

<script>

var t=0;
for (var i=1;i<=10;i++)

{
      t=t+i;
}

      document.write("Toplam="+t);

</script>

Javascript Örnekleri : For döngüsü kullanarak 1 ile 100 arasındaki ÇİFT sayıların toplamını ekrana yazdıran javascript kodlarını yazınız.

1.Yöntem:

<script>

var t=0;
for( var i=0;i<=100;i=i+2)

{
   t=t+i;     
}

document.write("Toplam="+t);

</script>

2.Yöntem:

<script> 

var t=0;
for(var i=0;i<=100;i++)

{
     if(i%2==0)
     t=t+i;
}

document.write("Çiftlerin toplamı="+t);

</script>

Javascript Örnekleri : For döngüsü kullanarak  1-100 arasındaki 3 ve 7’ye tam bölünen sayıları ve toplamlarını ekrana yazan javascript kodlarını yazınız.

<script>

var t=0;
for(var i=1;i<=100;i++)

{
   if(i%3==0 && i%7==0)
    {
       document.write(i+"<br>");
       t=t+i;    
     }       

}
document.write("Toplam="+t);

</script>

Javascript Örnekleri : For döngüsü kullanarak ekrana büyüyen font ile MERHABA yazan javascript kodlarını yazınız.

<script type="text/javascript">

for (var i = 0; i < 10; i++) {

document.write("<span style='font-size:" + i + 5 + "px;'>MERHABA</span><br/>");

}       

</script>

Javascript Örnekleri : For döngüsü ile ekrana aşağıdaki şekildeki gibi yıldızları yazdıran javascript kodlarını yazınız.

*
**
*** 

<html>
<head>
<script type="text/javascript">
for (var i = 0; i < 10; i++

   {
      for (var x = 0; x < i; x++)
        {
            document.write("*");
        }

     document.write("<br/>");

     }

</script>
</head>
<body>
</body>
</html>

 2.Yöntem

<script>

var t="*";
for(var i=0;i<3;i++)
  {
      document.write(t+"<br>");
      t=t+"*";    
   }

</script>

Javascript Örnekleri : For döngüsü ile kullanıcının girdiği mesajı yine kullanıcının girdiği tekrar sayısı kadar yazdıran javascript kodlarını yazınız.

<script type="text/javascript">
var mesaj = prompt("Mesaj Girin");
var sayi = prompt("Tekrar Sayısını Girin");
for (var i = 0; i < parseInt(sayi); i++)
   {
    document.write(mesaj + "<br/>  ");
   }

</script>

Javascript Örnekleri : For döngüsü ile 1’ler çarpım tablosunu ekrana yazdıran javascript kodlarını yazınız.

<script type="text/javascript">
for (var i = 1; i <= 10; i++)
   {
      document.write("1*" + i + "=" + 1 * i + "<br/>");
   }

</script>

Javascript Örnekleri : For döngüsü ile  10’dan 1’e doğru geri geri sayıları yazdıran javascript kodlarını yazınız.

<script  type="text/javascript">
for (var i = 10; i >=1; i--)
     {
       document.write(i+"<br/>");
     }   
</script>

Javascript Örnekleri : For döngüsü ile ekrana aşağıdaki şekildeki gibi yıldızları azalarak yazdıran javascript kodlarını yazınız.

*******
******
****

<script type="text/javascript">
for (var i = 10; i >= 1; i--)
     {
        for (var x = 0; x < i; x++)
           {
             document.write("*");
           }
        document.write("<br/>");

      }

</script>

Javascript Örnekleri : For döngüsü ile 10’lar çarpım tablosunu ekranda bir tablo içinde veren javascript kodlarını yazınız.

<script type="text/javascript">
document.write("<table border='1'><tr>");
   for (var x = 1; x <= 10; x++)
     {       
        document.write("<td>");
           for (var i = 1; i <= 10; i++)
               {
                  document.write(x+"*" + i + "=" + x * i + "<br/>");
               }
          if(x==5)
              {
                 document.write("</tr><tr>");
              }
      document.write("</td>");
     }   
  document.write("</tr><table>");
</script>

JAVASCRIPT KOŞUL DEYİMLERİ 

1.   Javascript if-else Koşul Deyimi

Şartın doğru olup olmadığını denetler, şart doğruysa parantezler arasındaki kodları çalıştırır.

<script>
   if(şart)
    {
           Şart doğru ise çalıştırılacak kodlar
    }
else
    {
     Şart yanlış ise çalıştırılacak kodlar
    } 
</script>

Javascript Örnek: Girilen doğum tarihine göre yaşı hesaplayan, yaşı 18’den küçük ise “ehliyet alabilirsiniz” değilse “ehliyet alamazsınız” yazan javascript kodlarını yazınız.

<script>
var dt,yas;
dt=prompt("Doğum tarihini giriniz:");
yas=2018-dt;
document.write("Yaşınız="+yas+"<br>");
if(yas<18)
document.write("ehliyet alamazsınız");
else
document.write("ehliyet alabilirsiniz");
 </script> 

Javascript Örnek: Kullanıcıdan alınan 1.yazılı ve 2.yazılı notuna göre ortalamasını hesaplayıp, ortalaması 50’den küçükse “Kaldınız” değilse “Geçtiniz” yazan javascript kodlarını yazınız.

<script>
var y1,y2,ort;
y1=prompt("1.yazılı notunu giriniz");
y2=prompt("2.yazılı notunu giriniz");
ort=(Number(y1)+Number(y2))/2;
document.write("Ortalama="+ort+"<br>");
if(ort<50)
document.write("Kaldınız");
else
document.write("Geçtiniz");
 </script>

Javascript Örnek: Bir mağazada alınan ürünün fiyatı 100 tl ve üzerinde ise 5 tl kargo ücreti alınmaktadır. Ürünün fiyatı girildiğinde toplam ödenmesi gereken tutarı hesaplayan bulan javascript kodlarını yazınız.

<script>
var fiyat,tutar;
fiyat=prompt("Ürün fiyatını giriniz");
if(fiyat<100)
{
tutar=Number(fiyat)+5;
document.write("Ödenecek tutar+Kargo="+tutar); 
}
else
document.write("Ödenecek tutar="+fiyat);
 </script>

Javascript Örnek:  Girilen bir sayının negatif mi, pozitif mi, 0’a eşit mi olduğunu bulan javascript kodlarını yazınız.

<script>
var sayı;
sayı = prompt("Sayıyı Giriniz :");
if(sayı<0)
document.write("Sayı Negatif ");
else if(sayı>0)
document.write("Sayı Pozitif ");
else
document.write("Sayı Nötr");
</script>

Ya da

<script>
var s,sonuc;
s=prompt("Sayıyı Giriniz:");
if(Number(s)>0)
{
document.write("sonuc: Pozitif");
}
if(Number(s)==0)
{
document.write("Sonuc: Nötr");
}
if(Number(s)<0)
{
document.write("Sonuc: Negatif");
}
</script>

Javascript Örnek: 20 ve 26 (20-26 dahil) derece arası sıcaklığın yaşanılabilir sıcaklık olduğu varsayılarak kullanıcıya bulunduğu ortamın sıcaklığı sorulup, ortamın yaşanılabilir veya yaşanılamaz sıcaklık olduğunu gösteren javascript kodlarını yazınız.

<script>
var s=prompt("Oda sıcaklığını giriniz=");
if((s>=20)&&(s<=26))
document.write("yaşanılabilir");
else
document.write("yaşanılamaz");
</script> 

Javascript Örnek: Bir dersin başarı durumu aşağıdaki gibidir:

0-44:Başarısız
45-54: Geçer
55-69:Orta
70-84:İyi
85-100:Pekiyi

Buna göre kullanıcıya dersten aldığı notu sorup başarı durumunu ekrana yazan javascript kodlarını yazınız. Kullanıcı 0-100 aralığı dışında not girerse “hatalı not” uyarısı verecek.

<script>
var n=prompt("notunuzu giriniz");
if((n>=0)&&(n<=44))
document.write("Başarısız");
if((n>=45)&&(n<=54))
document.write("Geçer");
if((n>=55)&&(n<=69))
document.write("Orta");
if((n>=70)&&(n<=84))
document.write("iyi");
if((n>=85)&&(n<=100))
document.write("pekiyi");
if((n<0)||(n>100))
document.write("Hatalı giriş");
</script>

2. Javascript Switch-Case Koşul Deyimi

Bir programda çok sayıda koşul kontrolü ve bunların sonucuna göre gerçekleştirilmesi gereken işlemler varsa, if-else yapısı yerine switch-case koşul deyimi kullanılır.

Kullanım Şekli:

   switch(değişken)
      {
          case durum1: komutlar; break;
          case durum2: komutlar; break;
          case durum3: komutlar; break;
          ......
          default: komutlar; break;
     }

Javascript Örnek: Girilen rakamın hangi güne karşılık geldiğini bulan javascript kodlarını yazınız. 

<script>
var gun=prompt("Bir sayı giriniz");
switch(gun)
{           
case "1":document.write("Pazartesi");break;
case "2":document.write("Salı");break;
case "3":document.write("Çarşamba");break;
case "4":document.write("Perşembe");break;
case "5":document.write("Cuma");break;
case "6":document.write("Cumartesi");break;
case "7":document.write("Pazar");break; 
default:document.write("1-7 arasında bir değer giriniz");break;                     
}
</script>

Javascript Örnek: Klavyeden girilen mevsim adına göre o mevsimde yer alan ayları ekrana yazdıran javascript kodlarını yazınız.

<script>
var m=prompt("Bir mevsim giriniz");
switch(m)
{
            case "ilkbahar":document.write("mart-nisan-mayıs");break;
            case "yaz":document.write("haziran-temmuz-ağustos");break;
            case "sonbahar":document.write("eylül-ekim-kasım");break;
            case "kış":document.write("aralık-ocak-şubat");break;
            default:document.write("bir mevsim adı giriniz");break;   

}
</script>

 Javascript Örnek: Girilen iki sayı üzerinde seçilen aritmetik işlemi uygulayan javascript kodlarını yazınız 

<script>
var a=prompt("1. sayıyı giriniz");
var b=prompt("2. sayıyı giriniz");
var islem=prompt("+,-,*,/ işlemlerinden birini seçiniz");
var s;
switch(islem)
{
            case "+":s=Number(a)+Number(b);document.write("Sonuç="+s);break;
            case "-":s=Number(a)-Number(b);document.write("Sonuç="+s);break;
            case "/":s=Number(a)/Number(b);document.write("Sonuç="+s);break;
            case "*":s=Number(a)*Number(b);document.write("Sonuç="+s);break;
            default:document.write("Bir işlem seçiniz");break;                
            }
</script> 

Javascript Örnek:  Girilen kısa ve uzun kenara göre seçilen  işlem alan ise dikdörtgenin alanını çevre ise çevresini hesaplayan javascript kodlarını yazınız.

<script>

var k=prompt("kısa kenarı giriniz");

var u=prompt("uzun kenarı girini<");

var islem=prompt("Alan için alan, çevre için çevre yazınız");

var alan,cevre;

alan=k*u;

cevre=2*(Number(k)+Number(u));

switch(islem)

{

case "alan":document.write("Alan="+alan);break;

case "çevre":document.write("Çevre="+cevre);break;

default:document.write("bir işlem seçiniz");break;

}

</script>

Javascript Örnek:  Girilen ayın hangi mevsime ait olduğunu bulan javascript kodlarını yazınız. 

<script>

var a=prompt("Bir ay giriniz");

switch(a)

{          case "ocak":
            case "şubat":
            case "aralık":document.write("Kış");break;  
            case "mart":
            case "nisan":
            case "mayıs":document.write("İlkbahar");break;
            case "haziran":
            case "temmuz":
            case "ağustos":document.write("Yaz");break;
            case "eylül":
            case "ekim":

            case "kasım":document.write("Sonbahar");break;
            default:document.write("Bir ay giriniz");break;           

}

</script>

Javascript dili, web sayfalarında dinamik içerik sağlamak ve kullanıcıyla iletişim kurmak için kullanılan, istemci tarafında çalışan bir dildir.

Javascript Kullanım Şekli:

<script>    

// çalıştırılacak kodlar bu bölüme yazılır.

  </script>

ya da

<script type=”text/javascript” language=”javascript”>

// çalıştırılacak kodlar bu bölüme yazılır.

</script>

HTML’de JavaScript Kullanımı

1.Yöntem: Script kodlarını head etiketleri arasına yazarak kullanmaktır. Head etiketleri arasında yazılan kodlar sayfa yüklenmeden derlenecektir.

<head>

<script type=”text/javascript” language=”javascript”>

document.write(“İlk javascript kodlarım”);

</script>

</head>

2.Yöntem: Script kodlarını body etiketleri arasına yazarak kullanmaktır. Body etiketleri arasına yazılan script kodları sayfa yüklendiğinde otomatik olarak derlenip çalışacaktır.

 <body>

<script type=”text/javascript” language=”javascript”>

document.write(“İlk javascript kodlarım”);

</script>

</body>

3.Yöntem:  *.js uzantılı olarak kaydettiğimiz harici bir JavaScript dosyasını sayfaya dahil edip kodları çalıştırmaktır. Notepad ya da Dreamweaver programını açarak script kodlarını yazarak ilkKod.js şeklinde klasörünüz içerisine kaydediniz.

 ilkkod.js içeriği

 document.write(“İlk javascript kodlarım”);

Kullanımı:

<body>

<script src=”ilkkod.js” type=”text/javascript” language=”javascript”>

</script>

</body>

JavaScript Yazım Kuralları

JavaScript dilinde değişkenler, fonksiyonlar vb. nesneler;

• Sayı ile başlayamaz.
• Kelimeler arasında boşluk kullanılamaz.
• Boşluk yerine _ işareti kullanılır.
• JavaScript dili için ayrılmış kelimeler herhangi bir nesneye isim olarak verilemez.

JavaScript Değişken ve Değişken Tanımlama

Javascript’de değişken tanımlama şu şekilde yapılmaktadır.

 var değişken_ismi;

Değişkenlere değer vermek için;

 var yazili=50;
 var ad="Ali";
 var yanit='E';
 var cevap=true;

JavaScript Operatörleri

          1. Aritmetik Operatörler

Örnek

var a = 15;

var b = 40;

var x = a+b;

document.write('İşlemin Sonucu :'+x);

Ekrana 55 Çıktısını verecektir.

Örnek

var a = 3, b = 4;

alert(a-- + b);

Ekran Çıktısı 7 olacaktır.

var a = 3, b = 4;

alert(--a + b);

Ekran çıktısı 6 olacaktır.

      2.Karşılaştırma Operatörleri

Veriler arasında belli kriterleri araştırmak için kullanılır.

Örnek:

                    3.Mantıksal Operatörler

Eğer karşılaştırmayı birden fazla durumu dikkate alarak yapacaksak mantıksal operatörleri kullanırız.

• '&&' : 'And(ve)' operatörü: Koşulların hepsi doğru ise true değerini verir.
• '|| ' : 'Or(veya)' operatörü: Koşulların en az birinin doğru olması halinde true değerini verir.
• '! ' : 'Not' operatörü: Koşulların hepsinin yanlış olması durumunda true değerini verir.

İşlem Önceliği

JavaScript kodları çalıştırılırken aşağıdaki tabloya göre operatör öncelikleri belirlenir.

Javascript Örnek Sorular:

Soru: Girilen vize ve final notuna göre ortalamayı bulan javascript kodlarını yazınız(ortalama hesaplanırken vize notunun %40’ı , final notunun %60’ı alınacaktır).

<script>

var v,f,ort;

v=prompt("vize notunu giriniz");

f=prompt("final notunu giriniz");

ort=v*0.4+f*0.6;

document.write("Ortalamanız="+ort);

</script>

Soru: Girilen ürün adeti ve birim fiyatına göre ödenecek tutarı hesaplayan javascript kodlarını yazınız.

<script>

var a,f,t;

a=prompt("Adeti giriniz=");

f=prompt("fiyatı giriniz=");

t=a*f;

document.write("Tutar="+t);

</script>

Soru: Girilen doğum tarihine göre yaşı hesaplayan javascript kodlarını yazınız.

<script>

var dt,yas;

dt=prompt("Doğum tarihini giriniz:");

yas=2018-dt;

document.write("Yaşınız="+yas+"<br>");

</script>

Kalıp Ayrıntı Sayfa Kümesi oluşturmak için yeni bir sayfa oluşturuyoruz. Her zamanki gibi yeni bir veri tabanı sayfası oluşturduğumuzda “Sunucu Davranışları”ndan kayıt kümesini oluşturuyoruz.  Ekle/Data Objects/Kalıp Ayrıntı Sayfa Kümesi’ ne tıklıyoruz.

Yukarıdaki pencere çıkınca TAMAM düğmesine tıklıyoruz. Belgeyi “listesayfasi.asp” olarak kaydediyoruz.

Karşımıza yukarıdaki pencere geliyor. Sadece “Göster” kısmındaki 10 değerini 3 yapıyoruz. “Ayrıntı Sayfası Adı”na “detaylistesi” yazıp tamama tıklıyoruz. Dreamweaver “detaylistesi.asp” diye bir sayfa oluşturuyor. Sonuç olarak “listesayfasi.asp” ve “detaysayfasi.asp” isimli iki sayfamız oluşmuştur. Bu sayfalar aşağıdadır.

“listesayfasi.asp” sayfasını ön izleme yapıyoruz. Görüldüğü gibi toplam 7 kayıt var. Bunlardan sadece 3 tanesi gözüküyor. “Sonraki” linki ile diğer kayıtlara ulaşabiliriz. Kimlik sütununa baktığımızda ilgili kayıtlarda link bulunmaktadır. Hangi linke tıklarsanız o satırdaki kaydın ayrıntılarını görürüz. 3 yazan linke tıkladığımızda aşağıdaki pencere görüntülenmektedir.

Detaylistesi.asp

Dreamweaver ile veri tabanına kayıt eklemiştik (incelemek için tıklayınız), bu yazımızda ise girilmiş kayıtların güncellenme işlemlerini yapacağız. Bunun için boş bir belge açıyoruz. Yine veri bağlantıları sekmesinden ilgili kayıt kümesini ekliyoruz.

Bir önceki yazımızda veri tabanını oluşturduk, veri tabanımızı Dreamweaver’a tanıttık ve kayıtlarımızı listeledik (incelemek için Tıklayınız). Sıra dreamweaver ile access veri tabanına kayıt eklemeye geldi.

Veritabanı uygulaması yapabilmek için öncelikle Access programı ile bir veritabanı oluşturmamız gerekir. Burada dikkat edilecek husus veritabanının 2003 uyumlu olarak kaydedilmesi gerekmektedir.  veritabani.mdb dosyası içine aşağıda görüldüğü gibi “tablo” isimli bir tablo oluşturuyoruz.