E-Sınav Bölüm-2(Sınav giriş ekranı)


       Merhaba gençler daha önce sizlerle web sayfamıza hiç bir elaman yerleştirmeden, form elemanlarını kod ile ekleyerek basit bir soru kayıt yönetim sayfası kodlamış idik bu defa ise e-sınav sisteminde kullanıcının sisteme giriş yapacağı sayfayı kodlayacağız. Sınav giriş ekranı kabaca aşağıda verdiğim gibi oldukça basit ve herhangi bir css teması kullanılmadan yapılmış bir ekran olacak ki buradaki temel konu zaten tasarım değil asp.net ile kullanıcı giriş ekranındaki kontrol işlemleridir. Öncelikle sizlerle yıl içerisinde bazı klasörleri kullanıcı erişimine kapatarak bu klasörler ve içerisindeki dosyalara yine bir kullanıcı adı ve şifre ile eriştiğimiz düzeneğe benzer işlemler yapacağımızı belirtmek isterim fakat buradaki işlemlerimiz çok ama çok daha kolay...

Yukarıda verilen kullanıcı giriş ekranında:

  1. Kullanıcı verilerinin kontrolleri javascirpt ile yapılmıştır,
  2. Kullanıcı adını ya da şifre alanını boş bırakması engellenmiştir, şayet böyle bir durum meydana gelirse formun altında yer alan bir alanda uyarı mesajı görüntülenmektedir.
  3. Gerekli alanlar doldurulduktan sonra form verilerinin postalanması yine javascript ile yapılmıştır.
  4. Formun tasarımı yapılırken aşağıda verilen HTML kodları yazılmıştır.

        Sistemin işleyişine kısaca değinecek olursak; kullanıcı gereken verileri girip Giriş tuşuna bastığında sinavGiris.aspx.cs sayfasında aşağıdaki kontoller yapılmaktadır.

  1. Öncelikle data veritabanında kullanicilar tablosunda verilen kullanıcı adı ve şifresine sahip bir kullanıcı var mı yok mu kontrol ediliyor, şayet bilgiler tabloda bulunamazsa kullanıcı "Yanlış kullanıcı adı ya da şifre" mesajı uyarılmaktadır.
  2. Eğer girilen verilere sahip bir kullanıcı bulunursa bu defa da sinav tablosunda bu kullanıcının daha önce bu sınava giriş yapıp yapmadığı yani daha önce bu kullanıcı için sınav tablosunda bir kayıt oluşturulup oluşturulmadığı kontrol ediliyor. Şayet kullanıcı için sinav tablosunda bir kayıt bulunamaz ise yeni bir kayıt oluşturuluyor (Acaba neden?)
  3. Son olarak kullanicilar tablosunda kaydı bulunan kullanıcının bilgileri yani kullanıcı adı Session["kullanici"] ve id bilgisi Session["kid"] oturum değişkenlerine aktarılarak kullanıcı soruları okuyup cevaplandırabileceği sinav.aspx sayfasına yönlendirilmektedir.

sinavGiris.aspx dosyasının HTML kodları aşağıdaki gibidir gözlemleyeceğiniz üzere temel HTML elemanları kullanılmış ve tasarım çalışma zamanında kodlar ile değil de tasarım zamanında temel HTML elemanları kullanılarak yapılmıştır. Burada id=uyari olarak isimlendirilen div nesnesinde kullanıcıya temel hata ya da uyarı mesajları verilmektedir. Ayrıca sayfada daha önce değindiğimiz temel denetim işlemlerine ait javascript kodları ise link olarak bulunmaktadır, javascript kodları sinavGiris.js dosyasında tutulmaktadır. Benzer biçimde temel biçimlendirme işlemlerine ait kodlar ise sinavGiris.css dosyasında saklanmaktadır.

< html xmlns="http://www.w3.org/1999/xhtml"> 
< head runat="server"> 
< title> ..:: Kullanici Girisi ::..< / title> 
< link rel="stylesheet" type="text/ css" href="sinavGiris.css" / > 
< script type="text/ javascript" src="sinavGiris.js"> < / script> 
< / head> 
< body style="font-family:Arial"> 
< form id="form1" runat="server"> 
< div> 
< table id="disTablo"> 
< tr> 
< td align="center" valign="middle"> 
< div id="baslik"> Kullanıcı bilgileriniz< / div> 
< !-- kontroller --> 
< div id="yerTutucu"> 
	< span class='etiket'> Kullanıcı adı: < / span> 
	< input name="txtAdi" id="txtAdi" type="text" value="" class="kontrol" / > 
	< span class='etiket'> Şifre: < / span> 
	< input name="txtSifre" id="txtSifre" type="password"  value="" class="kontrol" / > 
	< span class="etiket">  < / span> 
	< input name="btnGiris" id="btnGiris"  type="button" onclick="islemYap(1)" value="Giriş" class="dugme" / > 
	< input name="btnIptal" id="btnIptal"  type="button" onclick="islemYap(2)" value="iptal" class="dugme" style="background-color:crimson" / > 
	< span class="etiket">  < / span > 
	< div id="uyari" runat="server"> 
	Lütfen kullanıcı adı ve şifre bilgilerinizi eksiksiz giriniz. Tüm veriler büyük küçük harf duyarlarıdır.
	< / div>        
< / div>                 
< / td> 
< / tr> 
< / table> 
< / div> 
< / form> 
< / body> 
< / html> 
sinavGiris.js dosyasında yer alan islemYap() fonksiyonu tasarım ekranında bulunan İptal düğmesi tıklandığında islemYap(2) ve Giriş düğmesi tıklandığında ise işlemYap(1) şeklinde çağrılır. islemYap() fonksiyonu 2 ile çağrıldığında kontrolleri temizlerken 1 ile çağrıldığında ise kontrol() fonksiyonunu tetikler ve şayet kontrol() fonksiyonu true/doğru sonucunu üretirse form verileri sunucuya gönderilr, işlem bu kadar basit.
function kontrol() {
////////////////////////////////////////////////////////
// Kodlama          : Bilal SERT
// Amaç             : Yeni kayit icin form alanlarinin 
//                    bos birakilmasini engellemek
// Tarih|Saat       : 30.05.2020 | 15:00
// G|Ç              : yok | yok
////////////////////////////////////////////////////////
var bilgi = "< span >";
 
if (document.getElementById("txtAdi").value == "") {
	bilgi  + =  "Kullanıcı adı boş bırakılamaz";
	bilgi  + =  "< / span >";
	document.getElementById("uyari").innerHTML = bilgi;
	return (false);
} else if (document.getElementById("txtSifre").value == "") {
	bilgi  + =  "Şifre alanı boş bırakılamaz";
	bilgi  + =  "< / span >";
	document.getElementById("uyari").innerHTML = bilgi;
	return (false);
}
return (true);
} //end of kontrol
 
function islemYap(islemID) {
////////////////////////////////////////////////////////
// Kodlama          : Bilal SERT
// Amaç             : Formu sunucuya gondermek
// Tarih|Saat       : 30.05.2020 | 14:42
// G|Ç              : dugmeler (giris ve iptal)| yok
////////////////////////////////////////////////////////
if (islemID == 1) {
	//giris
	if (kontrol() == true) document.getElementById("form1").submit();
} else if (islemID == 2) {
	//iptal
	document.getElementById("txtAdi").value = "";
	document.getElementById("txtSifre").value = "";
}
} //end of islemYap

        Evet gelelim asıl işleri yaptığımız C# kodlarına; öncelikle belirtmek isterim ki buradaki temel amaç öğretim bunu sakın aklınızdan çıkarmayın kodlarımızı okurken ve kullanırken bunu lütfen aklınızdan çıkarmayın çünkü çok daha farklı yöntemlerle çözebileceğiniz işlemleri bendeniz burada yıl içerisindeki öğrendiklerimizi kullanarak gerçekleştirmekteyim ve mümkün olduğu kadar da okunabilir kodlar yazıyorum yazmaya çalışıyorum. Şimdi sizlere burada bir soru sormak istiyorum, veritabanına bağlantı açtıktan sonra tüm işlemleri yapsak ve sonrasında bağlatıyı kapatsak yani her işlem için ayrı ayrı bağlantı aç kapat yapmasak çok daha iyi olmaz mıydı?



using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Data.OleDb;
 
public partial class sinavGiris : System.Web.UI.Page
{
OleDbConnection conn = new OleDbConnection();
OleDbCommand cmd = new OleDbCommand();
OleDbDataReader dr;
OleDbDataAdapter da = new OleDbDataAdapter();
DataSet ds = new DataSet();
string adi = "", sifre = "";
protected void Page_Load(object sender, EventArgs e)
{
//sayfa sunucuya geri gonderildiginde
if (Page.IsPostBack)
{
	adi = Request.Form["txtAdi"];
	sifre = Request.Form["txtSifre"];
	//uyari.InnerHtml = "Adi: " + adi + "
" + "Sifre: " + sifre;
//kullanici var mi? Kontrol edelim if (kullaniciVarmi()) { //kullanici ilk defa sinava giris yapiyorsa sinav tablosunda //kullanici icin bir bos bir kayit olusturuyoruz. if (!dahaOnceSinaviAlmismi()) sinavKayitBilgisiOlustur(); //sonrasinda kullaniciyi sinav sayfasina yonlendiriyoruz. Response.Redirect("~/sinav.aspx"); } } }//end of page_load     bool kullaniciVarmi() { /////////////////////////////////////////////////////////////// //Created By : Bilal SERT //Date /Time : .../.../2020 /00:00 //Aim : kullanici kayitli kullanici mi degil mi? //I/O : none //Calls : //Called by : Page_Load() /////////////////////////////////////////////////////////////// bool sonuc = false; conn.ConnectionString = "Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" + Server.MapPath("~/data.mdb"); cmd.Connection = conn; cmd.CommandType = CommandType.Text; cmd.CommandText = "SELECT TOP 1 * FROM kullanicilar WHERE kullanici='" + adi + "' AND sifre='" + sifre + "'"; try { conn.Open(); da.SelectCommand = cmd; da.Fill(ds, "kullanicilar"); if (ds.Tables["kullanicilar"].Rows.Count != 0) { //kullanici bilgileri oturum bilgileri olarak okunuyor Session["kullanici"] = ds.Tables["kullanicilar"].Rows[0][1].ToString(); ; Session["kid"] = ds.Tables["kullanicilar"].Rows[0][0].ToString(); //Response.Redirect("~/sinav.aspx"); sonuc = true; } else uyari.InnerHtml = "Yanlış kullanıcı adı ya da şifre"; } catch (Exception ex) { uyari.InnerHtml = "Dikkat! Hata oluştu< / span > (Modul-1: Veri getirme)
"
+ ex.Message.ToString(); } finally { if (conn.State == ConnectionState.Open) { conn.Close(); conn.Dispose(); ds.Clear(); ds.Dispose(); da.Dispose(); } } return(sonuc); }//end of kullaniciVarmi   bool dahaOnceSinaviAlmismi() { ///////////////////////////////////////////////////////////// //Created By : Bilal SERT //Date /Time : .../.../2020 /00:00 //Aim : kullanici testi ilk defa mı alıyor // yoksa testi bir sebeple tamamlayamamis // devam mi ediyor //I/O : none //Calls : //Called by : Page_Load ///////////////////////////////////////////////////////////// bool sonuc = false; conn.ConnectionString = "Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" + Server.MapPath("~/data.mdb"); cmd.Connection = conn; cmd.CommandType = CommandType.Text; cmd.CommandText = "SELECT TOP 1 * FROM sinav WHERE kuID=" + Session["kid"]; try { conn.Open(); da.SelectCommand = cmd; da.Fill(ds, "sinav"); //daha once sinavi almis ama tamamlamamis if (ds.Tables["sinav"].Rows.Count != 0) sonuc = true; } catch (Exception ex) { uyari.InnerHtml = "Dikkat! Hata oluştu< / span > (Modul-2: Sinav kontrol modulu)
"
+ ex.Message.ToString(); } finally { if (conn.State == ConnectionState.Open) { conn.Close(); conn.Dispose(); ds.Clear(); ds.Dispose(); da.Dispose(); } } return (sonuc); }//end of dahaOnceSinaviAlmismi   void sinavKayitBilgisiOlustur() { /////////////////////////////////////////////////////////////////////////////// //Created By : Bilal SERT //Date /Time : .../.../2020 /00:00 //Aim : kullanici ilk defa testi aliyorsa // sinav tablosunda kullaiciya ait yeni kayit olusturuluyor //I/O : none //Calls : //Called by : Page_Load() ///////////////////////////////////////////////////////////////////////////////// int result = 0; conn.ConnectionString = "Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" + Server.MapPath("~/data.mdb"); cmd.Connection = conn; cmd.CommandType = CommandType.Text; cmd.Parameters.AddWithValue("@p1", Session["kid"]); cmd.CommandText = "INSERT INTO sinav(kuID)VALUES(@p1)";   try { conn.Open(); result = cmd.ExecuteNonQuery(); } catch (Exception ex) { uyari.InnerHtml = "Dikkat! Hata oluştu< / span > (Modul-3: Kayit olusturma)
"
+ ex.Message.ToString(); } finally { if (conn.State == ConnectionState.Open) { conn.Close(); conn.Dispose(); } } }//end of sinavKayitBilgisiOlustur   }//end of class

        Son olarak sayfamızdaki görsel tasarımın :) için yazılması gerek css kodlarınıa ki bunlara sinaviGiris.css dosyasında yer almaktadır ve kodlar aşağıdaki gibidir. Şimdiden sizlere kolay gelsin derken projemizin son bölümü olan e-sinav sayfasında görüşmek üzere diyorum. Mutlu kodlama günleri dilerim.

#disTablo
{
width: 100%;
height:100%;
}
#yerTutucu
{
width:500px;
height:230px;
box-shadow:3px 3px 5px gray;    
border:1px solid #eee;
padding-top:20px;
}
       
.etiket
{
font-weight:bold;
color:#333;
text-align:right;
width:150px;
margin-right:10px; 
font-size:16px;
margin-bottom:10px;
margin-top:10px;  
float:left; 
}
.kontrol
{
color:#333;
text-align:left;
padding-left:10px;
width:280px;
margin-right:10px; 
margin-bottom:10px;
margin-top:10px;                 
font-size:16px;   
float:left;  
border:1px solid #ccc;     
}
.dugme
{
color:#fff;
background-color:#0066ff;
font-weight:bold;
height:35px;
text-align:center;
padding:5px;
width:100px;
margin-right:10px; 
margin-bottom:10px;
margin-top:10px;                 
font-size:14px;   
float:left;           
}
#uyari
{
color:crimson;
background-color:#fff;
font-weight:bold;
text-align: left;
padding:5px;
width:300px;
height:50px;
margin-right:10px; 
margin-bottom:10px;
margin-top:10px;                 
font-size:14px;   
float:left;                 
}

#baslik 
{
    padding-top:15px; 
    padding-bottom:5px; 
    background-color:crimson; 
    color:#fff; 
    text-align:center;
    height:40px; 
    font-size:24px;
    width:500px; 
    box-shadow:3px 3px 5px gray; 
    margin-bottom:20px;
}