İyinet'e Hoşgeldiniz!

Türkiye'nin En Eski Webmaster Forum'una Hemen Kayıt Olun!

Kayıt Ol!

jQuery Dinamik Form Kontrolü Kodları

Hucukii

0
İyinet Üyesi
Katılım
7 Ekim 2012
Mesajlar
124
Reaction score
0
Sitelerinizde kullandığınız input (Giriş) alanlarını jQuery ile submit butonuna tıklandığı anda boş mu değilmi diye kontrol ettirmek ve boşsa sayfayı yenilemeden ekrana uyarı verdirtmek için aşağıdaki kodları kullanabilirsiniz.Kodların açıklamasını az çok yapmaya çalıştım..

Örneği görmek istiyorsanız buraya tıklayabilirsiniz..jQuery Dinamik Form Kontrolü - Demo

PHP:
<meta charset="utf-8">
<style type="text/css">

	#genel{
		width: 500px;
		height: auto;
		margin: 0 auto;
		border:1px solid #b3b3b3;
		background: #f9f9f9;
		text-align: center;
	}
	#genel input[type="text"]{
		margin: 10px;
		height: 30px;
		outline: none;
		width: 70%;
	}
	#genel .uyari{
		background: #E47569;
		border: 1px solid red;
	}
</style>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script type="text/javascript" >
$(document).ready( function(){
 
//eğer kayıt formunda submite tıklanmışsa bu fonksiyon devreye girer
$("#kayit_form").submit(function() {
 
//isim id'sine sahip inputun içinde değer varmı yokmu diye kontrol ettirdik..Eğer yoksa uyari class'ına yazı yazdırdık..
if($("#isim").val()==""){
$(".uyari").text("Hata:Lütfen formdaki 'İsim' alanını doldurunuz..");
return false;
}
//soyisim id'sine sahip inputun içinde değer varmı yokmu diye kontrol ettirdik..Eğer yoksa uyari class'ına yazı yazdırdık..
if($("#soyisim").val()==""){
$(".uyari").text("Hata:Lütfen formdaki 'Soyisim' alanını doldurunuz..");
return false;
}
//email id'sine sahip inputun içinde değer varmı yokmu diye kontrol ettirdik..Eğer yoksa uyari class'ına yazı yazdırdık..
if($("#email").val()==""){
$(".uyari").text("Hata:Lütfen formdaki 'E-Mail' alanını doldurunuz..");
return false;
}
// tüm alanlar doldurulduktan sonra form submit edilir.
return true;
});
 
});
</script>
<div class="uyari"></div> 
<!-- Eğer boş alan kalırsa bu uyari class'ı devreye girecektir.-->
<form id="kayit_form">
    İsim:<br>
    <input type="text" id="isim" name="isim"> <br>
    Soyisim:<br>
    <input type="text" id="soyisim" name="soyisim"> <br>
    E-Mail:<br>
    <input type="text" id="email" name="email"> <br>
 
    <input type="submit">
</form>
</div>
 

Türkiye’nin ilk webmaster forum sitesi iyinet.com'da forum üyeleri tarafından yapılan tüm paylaşımlardan; Türk Ceza Kanunu’nun 20. Maddesinin, 5651 Sayılı Kanununun 4. maddesinin 2. fıkrasına göre, paylaşım yapan üyeler sorumludur.

Backlink ve Tanıtım Yazısı için iletişime geçmek için Skype Adresimiz: .cid.1580508955483fe5

Üst