Programlama

PHP ve jQuery Kullanarak Form Submit

09.06.2010

Artık neredeyse bir endüstri standardı haline gelen jQuery ile formunuzu hiiiç uğraşmadan post etmek ve sayfa değişmeden işlemi gerçekleştirmek çok kolay. Buyrunuz kod (ayrıca Blogengine'in yeni syntax extension'ını deniyorum :)

Sayfanızın Kodu Şu Şekilde :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html>
<head>
	<title>JQuery Form Example</title> 
	<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
	<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery.validate/1.7/jquery.validate.min.js"></script>
	<script type="text/javascript">
	$(document).ready(function(){
		$("#myform").validate({
			debug: false,
			rules: {
				name: "required",
				email: {
					required: true,
					email: true
				}
			},
			messages: {
				name: "Please let us know who you are.",
				email: "A valid email will help us get in touch with you.",
			},
			submitHandler: function(form) {
				// do other stuff for a valid form
				$.post('process.php', $("#myform").serialize(), function(data) {
					$('#results').html(data);
				});
			}
		});
	});
	</script>
	<style>
	label.error { width: 250px; display: inline; color: red;}
	</style>
</head>
<body>
<form name="myform" id="myform" action="" method="POST">  
<!-- The Name form field -->
    <label for="name" id="name_label">Name</label>  
    <input type="text" name="name" id="name" size="30" value=""/>  
	<br>
<!-- The Email form field -->
    <label for="email" id="email_label">Email</label>  
    <input type="text" name="email" id="email" size="30" value=""/> 
	<br>
<!-- The Submit button -->
	<input type="submit" name="submit" value="Submit"> 
</form>
<!-- We will output the results from process.php here -->
<div id="results"><div>
</body>
</html>

veee sonuç olarak sayfanız hiç yenilenmeden form'unuz gönderiliyor hemi de giriş kontrolleri yapıldıktan sonra ;)

Bu arada SyntaxHightlighter süper eklentiymiş. Yukarıdaki kodu bu şekilde renklendiren Javascript tabanlı bu eklentiyi kullanmak isteyen olursa 

http://alexgorbatchev.com/wiki/SyntaxHighlighter

Bunları da Oku, Sorucam

1 Yorum

  • Reply Taylor 19.04.2024 at 09:37

    jQuery, formların işlenmesini kolay ve hızlı hale getirdiği için gerçekten hoşuma gidiyor! Sayfayı yeniden yükleme gereksinimini azaltmakla kalmıyor, aynı zamanda her şeyin sorunsuz ve akıcı olmasını sağlayarak kullanıcı deneyimini geliştiriyor. jQuery Validate kullanımı da girdi kontrolünün güvenilirliğini artırarak gönderilen verilerin doğru olmasını sağlıyor. Bu teknolojiye gerçekten değer veriyorum!
    arabic mehndi design

  • Yorum Yaz